6 Rules to Designing Amazing Mobile Apps

3994db1807811ceface5667bbbcb7311?s=47 Brian Fling
October 02, 2011

6 Rules to Designing Amazing Mobile Apps

THE PATH TO CREATING MEMORABLE MOBILE EXPERIENCES

Building a mobile app isn’t easy. Regardless of chosen platform or technology creating a memorable mobile experience has some pretty intense challenges throughout. However if you can get it right it can have some incredible rewards and propel your brand in more ways than one. After spending ten years building mobile apps for some of the biggest companies in the world, author and mobile designer Brian Fling shares his six rules for building amazing apps that will either you get you started or improve upon your next release.

3994db1807811ceface5667bbbcb7311?s=128

Brian Fling

October 02, 2011
Tweet

Transcript

  1. Brian Fling @fling Rules for Designing Amazing Apps 6 1.

    2. 3. 4. 5. 6.
  2. great mobile design is not made in Photoshop MADE WITH

    LOVE IN SEATTLE BY
  3. great mobile design is not made in Photoshop MADE WITH

    LOVE IN SEATTLE BY “We could build the best mobile app ever made, but if our customers don’t know why it’s good, then it could be the worst app ever made. —Scott Dierdorf @sdierdorf
  4. The Puget Sound Region

  5. The Puget Sound Region

  6. None
  7. None
  8. None
  9. None
  10. None
  11. None
  12. None
  13. None
  14. None
  15. None
  16. None
  17. None
  18. None
  19. mobiledesign.org

  20. None
  21. “[Brian] states making a native application can be the best

    thing for a product, but confirms on the other hand that the mobile web is the only long term commercially viable content platform for mobile devices —Thibault Imbert
  22. MADE WITH LOVE IN SEATTLE BY

  23. None
  24. MADE WITH LOVE IN SEATTLE BY

  25. MADE WITH LOVE IN SEATTLE BY

  26. Ancient Greek Technology

  27. STREETS CARTOGRAPHY CALIPER CRANE ESCAPEMENT TUMBLER_LOCK GEARS PLUMBING SPIRAL_STAIRCASE URBAN_PLANNING

    CROSSBOW WINCH WHEELBARROW SHOWERS CENTRAL_HEATING LIGHTHOUSE ALARM_CLOCK CHAIN_DRIVE CANNON LEVERS WATER_MILL GIMBAL DRY_DOCK ANALOG_COMPUTERS FIRE_HOSE VENDING_MACHINE WIND_VANE CLOCK_TOWER AUTOMATIC_DOORS Ancient Greek Technology
  28. MADE WITH LOVE IN SEATTLE BY

  29. POLITICAL_PHILOSOPHY ETHICS METAPHYSICS ONTOLOGY LOGIC BIOLOGY RHETORIC & AESTHETICS

  30. None
  31. “Greek philosophy has shaped the entire Western thought since its

    inception.”
  32. None
  33. None
  34. MADE WITH LOVE IN SEATTLE BY

  35. None
  36. None
  37. None
  38. None
  39. None
  40. None
  41. Some Innovations from the Roman Empire

  42. ABACUS AMPHITHEATER AQUEDUCT ARCH BOOK BRASS BRIDGE CAMEOS CAST_IRON CEMENT

    CRANE DAM DOME LOOM FLAMETHROWER GLASS BLOWING HAND_SOAP HYDRAULICS HYDROMETER KNIFE LIGHTHOUSES LEATHER MILLS STEAM_ENGINE NEWSPAPER ODOMETER PADDLE_WHEEL PEWTER POTTERY REAPER SAILS RUDDER SAUSAGE SEWERS SPIRAL_STAIRCASE STENOGRAPHY STREET_MAPS SURGICAL_INSTRUMENTS Some Innovations from the Roman Empire
  43. None
  44. None
  45. None
  46. None
  47. MADE WITH LOVE IN SEATTLE BY

  48. None
  49. MADE WITH LOVE IN SEATTLE BY

  50. MADE WITH LOVE IN SEATTLE BY MADE WITH LOVE IN

    SEATTLE BY
  51. MADE WITH LOVE IN SEATTLE BY

  52. None
  53. MADE WITH LOVE IN SEATTLE BY

  54. None
  55. None
  56. “In an economy where the only certainty is uncertainty, the

    one source of lasting competitive advantage is knowledge. When markets shift, technologies proliferate, and products become obsolete almost overnight, successful companies are those that consistently create new knowledge, disseminate it widely throughout the organization and quickly embody it in new technologies and products”
  57. None
  58. None
  59. computing network internet devices web dot-com 2010 2000 1990 1980

    1970 web 2.0 feature brick IPv4 touch 3G IPv6 2020 candybar 4G 2.5G 2G 1G ubiquity mobility pc’s mainframe next academia MADE WITH LOVE IN SEATTLE BY touch IPv6 4G ubiquity next
  60. None
  61. None
  62. MADE WITH LOVE IN SEATTLE BY

  63. None
  64. None
  65. MADE WITH LOVE IN SEATTLE BY

  66. None
  67. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #1 Brian Fling @fling Rules for Designing Amazing Apps
  68. mobile design is an entirely new breed of design. MADE

    WITH LOVE IN SEATTLE BY
  69. Phones are about making the most of the moment, simple

    tasks, & context.
  70. MADE WITH LOVE IN SEATTLE BY

  71. MADE WITH LOVE IN SEATTLE BY

  72. think of your app as a great book. MADE WITH

    LOVE IN SEATTLE BY
  73. think of your app as a great book. MADE WITH

    LOVE IN SEATTLE BY with a clear beginning, middle and end
  74. None
  75. None
  76. Tablets are about focus, consumption, simple tasks & portability.

  77. None
  78. None
  79. None
  80. None
  81. None
  82. ‣ Platform Aesthetic

  83. ‣ Platform Aesthetic ‣ Many Resolutions

  84. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

  85. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation
  86. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids
  87. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective
  88. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension
  89. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions
  90. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions ‣ Motion
  91. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions ‣ Motion ‣ Transitions
  92. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions ‣ Motion ‣ Transitions ‣ Color
  93. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions ‣ Motion ‣ Transitions ‣ Color ‣ Typography
  94. ‣ Platform Aesthetic ‣ Many Resolutions ‣ Pixels per Inch

    ‣ Orientation ‣ Design Grids ‣ Perspective ‣ Dimension ‣ Interactions ‣ Motion ‣ Transitions ‣ Color ‣ Typography ‣ Iconography
  95. None
  96. p/z universal

  97. p/z universal build a website that provided the best possible

    experience to the context.
  98. p/z universal build a website that provided the best possible

    experience to the context. iPad magazine
  99. p/z universal build a website that provided the best possible

    experience to the context. iPad magazine iPhone web app
  100. p/z universal build a website that provided the best possible

    experience to the context. iPad magazine iPhone web app Desktop website
  101. MADE WITH LOVE IN SEATTLE BY

  102. None
  103. 1x HTML5 Markup

  104. 1x HTML5 Markup 1x Hexadecimal CSS Framework

  105. 1x HTML5 Markup 1x Hexadecimal CSS Framework 1x Typography Framework

  106. 1x HTML5 Markup 1x Hexadecimal CSS Framework 1x Typography Framework

    3x Javascript Frameworks
  107. 1x HTML5 Markup 1x Hexadecimal CSS Framework 1x Typography Framework

    3x Javascript Frameworks 12x Media-Query-based Layouts
  108. a hexadecimal what?

  109. the hex-grid Typically when using a grid web designers are

    typically only using vertical units.
  110. the hex-grid but in mobile design, we must use horizontal

    units as well. this means that any unit size must work vertically as well as horizontally.
  111. None
  112. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #2 Brian Fling @fling Rules for Designing Amazing Apps
  113. 1 out of 3 projects go sideways because of BAD

    DATA MADE WITH LOVE IN SEATTLE BY
  114. None
  115. MADE WITH LOVE IN SEATTLE BY

  116. None
  117. None
  118. None
  119. None
  120. and there is no Design without Data Content is Data

  121. and there is no Design without Data Content is Data

  122. Creating Amazing Experiences for all Mobile Devices This document contains

    confidential information and is provided for private review only. Do not distribute without permission. Screenshot Placeholder CLIENT Automatic Data Processing PROJECTS ADP iPhone App, Mobile Web App, Content Proxy SERVICES Concept, Strategy, Design & Development DESCRIPTION We designed and developed an application for ADP customers to complete common tasks related to HR, payroll, and benefits in a mobile context.
  123. None
  124. “A new form of Web content that is meaningful to

    computers will unleash a revolution of new possibilities.”
  125. None
  126. None
  127. None
  128. None
  129. MADE WITH LOVE IN SEATTLE BY

  130. None
  131. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #3 Brian Fling @fling Rules for Designing Amazing Apps
  132. JARGON ALERT Context The circumstances that form the setting for

    an event, statement, or idea, and in terms of which it can be fully understood and assessed.
  133. context adds meaning to data MADE WITH LOVE IN SEATTLE

    BY
  134. None
  135. Events TV Billboard Radio Live Auditory Kinesthetic Visual Word of

    Mouth Print Ad Mobile Device QR
  136. Events TV Billboard Radio Live Website Auditory Kinesthetic Visual Word

    of Mouth Print Ad Mobile Device WAP SMS QR Cod SMS QR Code WAP SMS SMS Bluetooth WAP MMS MMS
  137. Events TV Billboard Radio Live Website Auditory Kinesthetic Visual Word

    of Mouth Print Ad Mobile Device IVR SMS IVR SMS WAP SMS QR Code SMS QR Code SMS MMS SMS WAP SMS SMS Bluetooth Notify WAP WAP MMS Email Send to Friend W No B WAP Site WAP Site Join Buy MMS ify d to nd Discuss Send to Friend Notify Buy Send to Friend Notify
  138. Events TV Billboard Radio Live Website Auditory Kinesthetic Visual Word

    of Mouth Print Ad Mobile Device IVR SMS IVR SMS WAP SMS QR Code SMS QR Code SMS SMS MMS SMS WAP SMS SMS Bluetooth Notify WAP WAP MMS Email Send to Friend WAP Site Notify Buy WAP Site WAP Site Send to Friend Join Buy Notify Notify Send to Friend Post WAP Site MMS Send to Friend Notify Send to Friend Join Discuss Send to Friend Notify Down load Down load Notify Vote Join Vote Notify Buy Send to Friend Notify
  139. types of context Big Ideas Location Device State of Mind

  140. None
  141. None
  142. None
  143. None
  144. types of context Big Ideas Location Device State of Mind

  145. None
  146. types of context Big Ideas Location Device State of Mind

  147. None
  148. None
  149. types of context Big Ideas Location Device State of Mind

  150. None
  151. always add value to the users context* MADE WITH LOVE

    IN SEATTLE BY
  152. always add value to the users context* *Doing so requires

    a little Psych 101 MADE WITH LOVE IN SEATTLE BY
  153. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #4 Brian Fling @fling Rules for Designing Amazing Apps
  154. None
  155. None
  156. interactions evoke strong feelings MADE WITH LOVE IN SEATTLE BY

  157. None
  158. MEDIUM (Mobile)

  159. CONTEXT MEDIUM (Mobile)

  160. CONTEXT MEDIUM (Mobile) INTERACTION

  161. The Elements of User Experience A basic duality: The Web

    was originally conceived as a hypertextual information space; but the development of increasingly sophisticated front- and back-end technologies has fostered its use as a remote software interface. This dual nature has led to much confusion, as user experience practitioners have attempted to adapt their terminology to cases beyond the scope of its original application. The goal of this document is to define some of these terms within their appropriate contexts, and to clarify the underlying relationships among these various elements. Jesse James Garrett jjg@jjg.net Visual Design: graphic treatment of interface elements (the "look" in "look-and-feel") Information Architecture: structural design of the information space to facilitate intuitive access to content Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality Navigation Design: design of interface elements to facilitate the user's movement through the information architecture Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site Content Requirements: definition of content elements required in the site in order to meet user needs Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Web as software interface Web as hypertext system Visual Design: visual treatment of text, graphic page elements and navigational components Concrete Abstract time Conception Completion Functional Specifications Content Requirements Interaction Design Information Architecture Visual Design Information Design Interface Design Navigation Design Site Objectives User Needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development) that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today. task-oriented information-oriented 30 March 2000 © 2000 Jesse James Garrett http://www.jjg.net/ia/
  162. Information Architecture: structural design of the information space to facilitate

    intuitive access to content Navigation Design: design of interface elements to facilitate the user's movement through the information architecture Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Content Requirements: definition of content elements required in the site in order to meet user needs Web as hypertext system Visual Design: visual treatment of text, graphic page elements and navigational components time Conception Completion nctional cations Content Requirements eraction ign Information Architecture Visual Design rmation Design rface Design Navigation Design ite Objectives User Needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site information-oriented
  163. Visual Design: graphic treatment of interface elements (the "look" in

    "look-and-feel") Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Web as software interface Concrete Abstract Functional Specifications C Requir Interaction Design Inf Archit Visual Desig Information Desi Interface Design Nav Site Objectives User Nee task-oriented
  164. JARGON ALERT Needs The circumstances in which something is necessary,

    or that require some course of action.
  165. Abraham Harold Maslow (April 1, 1908 – June 8, 1970)

    was an American psychologist. He is noted for his concept- ualization of a "hierarchy of human needs", and is considered the founder of humanistic psychology.
  166. None
  167. None
  168. None
  169. None
  170. None
  171. CONTEXT MEDIUM (Mobile) INTERACTION

  172. CONTEXT MEDIUM (Mobile) INTERACTION ?

  173. None
  174. None
  175. None
  176. None
  177. JARGON ALERT Skeuomorph A derivative object that retains ornamental design

    cues to a structure that was necessary in the original.
  178. http://www.flickr.com/photos/youraccount/sets/72157619967702538/with/3642814120/

  179. None
  180. None
  181. None
  182. None
  183. None
  184. None
  185. None
  186. great interactions evoke feelings MADE WITH LOVE IN SEATTLE BY

  187. None
  188. None
  189. “Unlike personality, attitudes are expected to change as a function

    of experience.”
  190. None
  191. Affect

  192. Affect The emotional response that expresses an individual's degree of

    preference for an entity.
  193. Affect Behavior

  194. Affect Behavior The verbal indication or typical behavioral tendency of

    an individual.
  195. Affect Behavior Cognition

  196. Affect Behavior Cognition The evaluation of the entity that constitutes

    an individual's beliefs about the object.
  197. None
  198. None
  199. None
  200. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS 1. Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #5 Brian Fling @fling Rules for Designing Amazing Apps
  201. details matter MADE WITH LOVE IN SEATTLE BY

  202. None
  203. None
  204. None
  205. None
  206. None
  207. None
  208. None
  209. design @ 1600% MADE WITH LOVE IN SEATTLE BY

  210. None
  211. None
  212. None
  213. 6x Navigation & Toolbars

  214. 6x Navigation & Toolbars 3x Alerts & Modals

  215. 6x Navigation & Toolbars 3x Alerts & Modals 26x Types

    of Views
  216. 6x Navigation & Toolbars 3x Alerts & Modals 26x Types

    of Views 15x View Controls
  217. 6x Navigation & Toolbars 3x Alerts & Modals 26x Types

    of Views 15x View Controls 13x Application Controls
  218. 6x Navigation & Toolbars 3x Alerts & Modals 26x Types

    of Views 15x View Controls 13x Application Controls 9x Animations & Transitions
  219. None
  220. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #6 Brian Fling @fling Rules for Designing Amazing Apps
  221. there are few tools or processes that suit mobile MADE

    WITH LOVE IN SEATTLE BY
  222. DESIGNERS DEVELOPERS

  223. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  224. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  225. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  226. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  227. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  228. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  229. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  230. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  231. Planning Interactions Design Integration Development Testing Fixes Deployment DESIGNERS DEVELOPERS

  232. None
  233. None
  234. None
  235. Mobile Design is Web Design

  236. Mobile Design is Web Design

  237. None
  238. Mobile Design is Software Design

  239. Mobile Design is Software Design

  240. This document contains confidential information and is provided for private

    review only. Do not distribute without permission. A Fully Agile Agency From Start to Finish
  241. This document contains confidential information and is provided for private

    review only. Do not distribute without permission.
  242. This document contains confidential information and is provided for private

    review only. Do not distribute without permission.
  243. Process

  244. Define Process

  245. Data Define Process

  246. Interaction Data Define Process

  247. Design Interaction Data Define Process

  248. Design Interaction Data Define Process Deliverables

  249. Design Interaction Data Define Project Brief Process Deliverables

  250. Design Interaction Data Define Project Brief Journeys Process Deliverables

  251. Design Interaction Data Define Project Brief Journeys Context Map Process

    Deliverables
  252. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit Process Deliverables
  253. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Process Deliverables
  254. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling Process Deliverables
  255. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Process Deliverables
  256. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Process Deliverables
  257. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams Process Deliverables
  258. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Process Deliverables
  259. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Process Deliverables
  260. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Design Brief Process Deliverables
  261. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Design Brief Wireframes Process Deliverables
  262. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Design Brief Wireframes Design Direction Process Deliverables
  263. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Design Brief Wireframes Design Direction Design Comps Process Deliverables
  264. Design Interaction Data Define Project Brief Journeys Context Map Content

    Audit API Audit Data Modeling App Flow Screen Descriptions Zone Diagrams App Map Reference Design Design Brief Wireframes Design Direction Design Comps Asset Library Process Deliverables
  265. 6 1. UNDERSTAND THE MEDIUM Get to know the differences

    between mobile and other mediums. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION A gift for pixel perfection and psych degree can come in handy. 5. FOCUS ON THE DETAILS Small screens don’t make things easier. They make things a lot harder. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. Brian Fling @fling Rules for Designing Amazing Apps
  266. None
  267. None
  268. None
  269. None
  270. None
  271. None
  272. None
  273. None
  274. EHARMONY HOME v1

  275. EHARMONY HOME v2

  276. EHARMONY HOME v3

  277. EHARMONY HOME v4

  278. EHARMONY HOME v5

  279. EHARMONY HOME v6

  280. Get in Touch Find Out How We Can Help You.

    Brian Fling Founder & Creative Director brian@pinchzoom.com +1 206 351-6060 My name is Brian Fling and I’m a Mobile Designer twitter.com/fling book mobiledesign.org company pinchzoom.com blog pinchzoom.com/fling THANK YOU