Downloaded 108 times
Uploaded byAndrew Smyk
Managing Responsive Design Projects
The document outlines key strategies for managing responsive design projects, highlighting the importance of content strategy, agile methodologies, and prototyping. It emphasizes avoiding silos in design and the need to test prototypes on various devices, while considering user interactions and content modeling. The author encourages leveraging a collaborative environment and incorporating user feedback for effective outcomes.
More Related Content
Similar to Managing Responsive Design Projects
Managing Responsive Design Projects
- 1. Managing Responsive DesignProjects @andrewsmyk FITC WebUnleashed 2014
- 3.
- 4. Tweet using hashtags:#WebU14 #managingRWD
- 6. @andrewsmyk 640 x480 800 x 600 1024 x 768 1200 x 900 1920 x 1200
- 8.
- 9.
- 11. Leveraging mobile toincrease Wrestling with a responsive projects student engagement Andrew Smyk HighWeb Ed – Arkansas July 27, 2012 @andrewsmyk
- 13.
- 14. 1. Content Strategy 2. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 15. 1. Content Strategy 2. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 18.
- 19. Pro Tip: Documentall the Types & Models of Devices You Encounter @andrewsmyk
- 20. Important! Note theDevices of Decision Makers in the Room @andrewsmyk
- 21.
- 22.
- 23. @andrewsmyk Content Modeling& Strategy • Content Engagement • Content Curation • Rank and Prioritize Content
- 24. Avoid coding orselecting frameworks before content modeling
- 25. Avoid coding orselecting frameworks before content modeling
- 26.
- 27.
- 28.
- 29.
- 30. RUN!!! @andrewsmyk Zombie Apocalypse!!
- 33. @andrewsmyk 1 2 3 4 5 6 7
- 34. @andrewsmyk 1 2 3 4 5 6 7
- 35. 1 2 3 4 5 6 7 A/B Test Content Models and early lo-fi Wireframes
- 36.
- 38. 1. Content Strategy 2. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 39.
- 40.
- 41.
- 42.
- 45.
- 46.
- 47. via Michelle Cryan-@sporkles
- 48. @andrewsmyk Pro Tip:Avoid Designing and Developing Projects in Silos
- 49.
- 50. 1. Content Strategy 2. Waterfall vs. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 51. @andrewsmyk Prototyping “Nowwe can think about users and their needs as it relates to content.”
- 53. “Work in Photoshopand Fireworks by all means (I do). Make static visuals as rich and as detailed as you want them to be.” Just don’t set the wrong expectations by showing them to your clients. ~ Andy Clarke @andrewsmyk
- 54. Logo needs tobe “bluer”
- 55. desktop + + main internal specialized variants? DAYS?
- 56. desktop + + main internal specialized tablet smart phone shiny & new + + main internal specialized + + main internal specialized + + main internal specialized variants? DAYS?
- 57. Logo needs tobe “bluer”
- 58. desktop + + main internal specialized tablet smart phone shiny & new + + main internal specialized + + main internal specialized + + main internal specialized variants? DAYS?
- 59. How blue isour logo?
- 60. desktop + + main internal specialized tablet smart phone shiny & new + + main internal specialized + + main internal specialized + + main internal specialized variants? DAYS?
- 61. We need tosee another design
- 62. desktop + + main internal specialized tablet smart phone shiny & new + + main internal specialized + + main internal specialized + + main internal specialized variants? DAYS?
- 63. Stop Wrestling withStatic Mockups @andrewsmyk
- 64.
- 65.
- 66.
- 67.
- 68.
- 69.
- 70. “Design consistency isnot about pixels.” @andrewsmyk
- 71.
- 72. “A prototype isworth a thousand words” Leigh Howells - @leigh @andrewsmyk
- 73. “A prototype isworth a thousand meetings” Mike Davidson - @mikeindustries @andrewsmyk
- 74. Pro Tip: AWorking Prototype can Help Make Decisions Faster
- 75. Think about theecosystem, not just the devices: @andrewsmyk
- 76.
- 77.
- 78. Use the righttools & technologies @andrewsmyk
- 79. @andrewsmyk am Iresponsive? ish. remote preview Ghostlab (license) Edge Inspect (CC subscription)
- 80. 1. Content Strategy 2. Waterfall vs. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 81. Logo needs tobe “bluer”
- 86. @andrewsmyk Visual inventory,you say… Responsive style tiles, you say…
- 88.
- 93.
- 94. User Testing, Toolsand TPS Cover Sheets
- 95. Pro Tip: BestPlace to Test on Devices? Visit a Mobile Carrier’s Store @andrewsmyk
- 96. @andrewsmyk Pro Tip:Build a Device Library
- 97. Plan for gesturesand taps.
- 98. Help users witherror and miss taps
- 99. Plan for the“Fat Finger”
- 100. Design for thethumb
- 101. Pro Tip: ATouch Template helps design Interactions
- 102.
- 103.
- 104.
- 105.
- 106.
- 107.
- 108.
- 109. They share acommon infrastructure, but mobile is NOT the traditional web @andrewsmyk
- 110. l Mobile isa different environment and requires new thinking and design considerations. @andrewsmyk
- 111. Harness the powerof a missile throwing robot with laser beam eyes on a UNICORN. @andrewsmyk
- 112.
- 113.
- 114. 1. Content Strategy 2. Agile 3. Prototyping 4. Art Direction @andrewsmyk
- 115.
- 116.
- 117.
- 118. Tweet using hashtags:#WebU14 #managingRWD
- 120.