January 28, 2013 - News Articles
Oftentimes when approached by clients and agencies, we’re asked about our creative process at ERA404. While people can easily see a step-by-step diagram of our development process, broken down by time, cost and client interaction, we have never really outlined how the creative process works here. This is partially because development, which is creative in its own right, is considerably more objective, pragmatic, and analytical. The process is linear, relying on previous checkpoints to proceed to latter ones.
Design, on the other hand, grows organically and chaotically. It pushes forward and outward in untraceable trajectories. If one thinks of development as a relay race with the baton being passed at regular relay points, design is more like a quixotic multi-player game of capture the flag. It’s undoubtedly the most challenging, gratifying (and possibly frustrating) part of our job here, riddled with stops, starts, reorientation, redirection, hidden doors, trap floors, exploration, and trial and error, relying purely on experience and gut instinct to reach the goal. And while the description above sounds daunting, it’s the primary reason we love our jobs so much.
So, depicting our creative process in a linear diagram like our development process is impossible. But each design roughly follows the same objectives along the uncharted path, which, coupled with client feedback and critiques, act as polestars in guiding us to their completion. Below are those objectives, distilled and organized as they would be in a perfect world, free of the organic and beautiful growth of real-world scenarios:
Defining the Problem
- Defining the Problem
To maximize success we first define the problem we are trying to solve—we articulate it and give it boundaries (what’s part of the problem? what’s outside our control?). We call upon our designers to help cull, visualize, express that problem in human terms—looking at it from many different views.
- Envisioning the Desired End State (Knowing what victory looks like)
(If you’ve ever been part of a team that seemed lost, it’s likely this step was skipped.) Knowing how to both characterize and recognize a victory will be vital when embarking on the journey of solving the problem. As designers, we can help prototype the end state (through scenarios, models, journey maps, etc.).
- Defining the Approach by Which Victory can be Achieved
Once we know where we want to go, we need to create a map to get there. That map must be imprinted in the minds of every participant along the way, including clients and team members. We find it helps to draw an actual map with our clients, to assist them in visualizing the distance and milestones to the destination.
- Inciting Support—And Then Action
In some cases, not everyone will want to make the journey. They’ll need to be inspired. Convinced. Reinforced. Educated. As designers, we call on our skills as communicators to help them see why they should come along.
- Seeking Insight to Inform the Prototyping of the Solution
After the team is assembled, in which the client plays an integral—if not central—role, the next task is to look at the work ahead and be smart about it. Often it pays to take pause and seek insight that will enable the team to prototype a solution. That means research. Our designers help structure that research, especially in reporting its findings.
- Prototyping Potential Solutions
The prototype might might literally mean physically prototyping the solution: building it in miniature, or as a one-off, to see if it will work. Or, it might mean prototyping a new customer experience—a collection of moments that make up an experience. In either case, we play a critical role in communicating the vision to clients.
- Delineating the Tough Choices
A good prototype (or prototypes) unearths all sorts of unexpected data and insight. And from that, tough choices emerge. Should we include this feature, or that? What if the solution costs more than clients have budgeted? Can the prototype be broken down into stages to make the objective more affordable and digestible? What if there are downsides? Together, with regular and consistent communication we try to make the choices evident.
- Enabling the Team to Work as a Team
And, when crucial to the project, we help the team work as a team: helping make choices, envisioning different outcomes, seeing the “whitespace” that connects divergent views and approaches.
- Choosing the Best Solution, Then Activating It
This is the culmination of many steps of hard work. If we do our jobs right, we can often be the pivotal voice in this step, helping argue for the best overall solution—we can visualize the case, see different sides of the problem and lay out a path for making a commitment to the chosen solution.
- Making Sure People Know about our Solution
Once a solution is chosen, the task becomes to ensure that people—customers, constituents, employees—know about it. In a traditional sense, this is about marketing the idea. In a deeper sense, it’s about empowering people to support/own/celebrate the solution.
- Selling the Solution
In most cases, an exchange of money or time will be involved—between seller and buyer, creator and participant, sponsor and beneficiary. That process is generally helped by design, so that people know what they’re buying and what it’s worth.
- Rapidly Learning and Reorienting Based on your Successes and Failures
The most effective projects are those in which we constantly learn, strive, and improve. Our job is to help take the team back through the journey, recounting the steps where good decisions were made and where the team could act differently next time.
June 19, 2006 - Information Resources
Removing the Marching Ants around SWF Files
As a result of the jury decision in Microsoft’s Eolas patent lawsuit, Microsoft created an Internet Explorer update that would force users to activate media items coded with “embed”, “applet” or “object” tags. The result of this decision is that while movies may play and function correctly in Firefox, Safari and other browsers, users must click Flash media to “activate” it and accept ActiveX alerts on pages containing Quicktime media.
For instance, we used to have our home page navigation coded like this:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="796" height="72" id="nav_home" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="nav_home.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <embed src="nav_home.swf" quality="high" bgcolor="#ffffff" width="796" height="72" name="nav_home" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object>
And in the body, we replace the object and embed tags with this:
The SWFObject allows for you to add all the parameters of Adobe’s default export using the addParam function.
To make things better, you can still pass variables to and from the Flash from PHP by adding the FLASHVARS variable with Stearns’ addParam function.
For instance, our interior navigation, with the PHP/Smarty variables, looks like this:
The resourceful Stearns’ provides the identical solution for embedding Quicktime movies to eradicate Microsoft’s ActiveX alert window.
And modify the code for your Quicktime video to use his format:
Incorporating the add.Param function for Quicktime parameters, you can easily add poster movies and controller options the same way you would in Flash: