Responsive Design & Prototyping -- An Agency Model (Part 1/3)
5 likes2,000 views
The document discusses the evolution of user experience (UX) design at Digitas Boston, emphasizing the need for an updated approach to design that transcends traditional wireframes. It advocates for rapid prototyping as a more effective method in the complex digital design ecosystem, highlighting the limitations of static wireframes in conveying interactive experiences. The content also outlines strategies and tools for UX designers to enhance their processes and improve user engagement.
Responsive Design & Prototyping -- An Agency Model (Part 1/3)
- 1. Responsive Design & Prototyping – Part 1 ! ! Responsive Design & Prototyping ! An Agency Model! " THE DIGITAS BOSTON TEAM!
- 2. Have a Question? ! ! Tweet: #UXDigitas"
- 3. Way Beyond Your ! Mother’s Wireframes…"
- 4. “At Digitas, we’ve traditionally looked at UX ! through an advertising and marketing communications ! lens, as opposed to an application-based, ! software development (or other*) lens…”" *! How about a “Next Generation ! Digital Experience” lens?"
- 5. A good experience is more than Art & Copy…"
- 6. A good experience is more than Art & Copy…"
- 7. A good experience is more than Art & Copy…"
- 8. A good experience is more than Art & Copy…"
- 9. So what does this mean?"
- 10. In the Agency, we’ve had trouble getting through…" Who the hell are we? " How we really think" Where did we come from? " History & evolution of UX" What do we do? " Our approach to the work" When should we be engaged? " When to bring us in" Who are we actually? " Names & faces" What to expect from us in future?" New UX strategies tools & tactics"
- 11. Is it a labeling issue? " User Experience — also regularly described as…" ID! Interaction Design! UI! User Interface Design! TA-s! IA! Those Assholes! Information Architecture! And various other things…! No. Its something more…"
- 12. What does this mean?"
- 13. Sometimes we ! need to look back…" To look forward…"
- 14. When Art met Copy, there was… a Breakthrough!" Output:" Advertising, Marketing Communications"
- 15. But wait! Then we had… a Paradigm Shift" Home New Models Old Models Pricing & O"ers Owners! Skip Intro >! Output:" Advertising, Marketing Communications for the Web" "
- 16. Now we have…" Strategy Sp ec ng ial ni n tie Pla s Art Choice (IA) Copy y log MO o hn Ps/C c Te RM s Metric Searc h Output:" Marketing Communications, Product Development, Software Development, Process Optimization, Customer Care, Social Dialogue — across all channels"
- 17. As User Experience Designers…" We now work together in a ! far more complex" Digital Design Ecosystem" "
- 18. And the challenge is that it’s…" …all happening right now" …always on" …all integrated" …always overlapping" " " But wait… hang on a minute — " now it’s completely different!" "
- 19. What does this mean for # User Experience Designers?!
- 20. “We can’t apply an old model to this new paradigm, and hope to achieve the same, or greater success”" "
- 21. Some examples # of new approaches…!
- 22. Rapid Prototyping ! Moving Beyond Wireframes! "
- 24. Research > Strategy > Wireframes > Comps > Code"
- 25. The case FOR wireframes" On rollover, show dropdown menu!
- 26. The case AGAINST wireframes"
- 27. The Pros & Cons of Wireframes" ! " Page layout & structure! $" Static – not interactive! ! " Content modules! $" Not intuitive – di%cult to ! " Lead to functional specs! understand! ! " Help creative $" Hard to show user paths! development! $" Version control! ! " Easy to make! $" Hard to test! $" Require a lot of “vision”!
- 28. Flat wireframes are Work gets judged on User experience outdated in today’s visual design while decisions are more complex and interactivity and sometimes made by interactive landscape! functionality is people without a full overlooked ! understanding of the issues !
- 29. Wireframes just aren’t enough." We need something better."
- 31. Prototyping Software" At Digitas Boston we use Axure! Other options include Flash, PowerPoint, iRise, InDesign, etc.!
- 32. Rapid Prototyping’s Advantages" Flat Wireframes! Prototypes! Tell! Show! Static! Interactive! Artifact! Living Dense! Document! Intuitive!
- 33. So let’s stop TELLING and start SHOWING!"
- 45. Getting the most out of prototyping" •" Be interactive from the start! •" Focus on flows! •" Fake it when data is involved! •" Accept limitations! •" Talk to your tech team! •" Add color to show interactive areas! •" A little bling goes a long way!