Revisiting Mobile App Design Professor Larry Heimann Carnegie Mellon - PowerPoint PPT Presentation

Revisiting Mobile App Design Professor Larry Heimann Carnegie Mellon University 67-442: Mobile Application Design & Development

A few things about the upcoming competition

Code review comments • Need testing • Need to organize code functionally • Need to separate out responsibilities into new, smaller classes • Nice to use marks, markdown for documentation • Consider structs vs. classes (passing by value vs. references)

iOS Core Design Philosophy • Deference • Clarity • Depth

Deference “Content should be the hero, everything else is secondary.”

Deference “Content should be the hero, everything else is secondary.” • Simplify

Deference “Content should be the hero, everything else is secondary.” • Simplify • Maximize Content

Deference “Content should be the hero, everything else is secondary.” • Simplify • Maximize Content • Colors

Deference “Content should be the hero, everything else is secondary.” • Simplify • Maximize Content • Colors • Typography is content https://developer.apple.com/videos/play/wwdc2016/803/

Clarity “Make things immediately obvious to your user.”

Clarity “Make things immediately obvious to your user.” • Make text readable Good Rules of Thumb for Text 1. 16pt is readable; don’t go lower 2. 120% - 140% line spacing 3. max line length: 45-85 characters

Clarity “Make things immediately obvious to your user.” • Make text readable • Use obvious icons

Clarity “Make things immediately obvious to your user.” • Make text readable • Use obvious icons • Descriptive screens

Clarity “Make things immediately obvious to your user.” • Make text readable • Use obvious icons • Descriptive screens • Meaning in color

Depth “Everything should be contextual and transitional.” • Transitions with animations • Blurred background • Gestures • Sounds (when appropriate)

iPhone sizes https://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions

iPad sizes

The “rule of thumb” Minimum Target: 44 x 44 pixels

Demo on invisible buttons, launch screen, etc.

Project teams Akash Kejriwal -- Sid Malladi Max Harlynking -- Donovan Powers • • Alex Wang -- Rho Eun Song Natalya Buchwald -- Becca Kern • • Asawari Kanitkar -- Shijie Rao Piyush Puri -- Glen Wise • • Bruce Lin -- Matt Gruber Sarah Reyes-Franco -- Connor Hanley • • David Gao -- Daniel Graf Sivan Mehta -- Jimmy Jameson • • Erin Dieirnger -- Katie Williams Sophie Zhao -- Helen Kim • • Gus Henry -- James Ormond Travis Chambers -- Andrew Wang • • Johnny Wu -- Svayam Mishra Emily Su -- Annette Chen -- Meghana • • Valluri Jordan Stapinski -- Jeremy Lee • Rumby Wilson -- Gaury Nagaraju -- • Karen Segal -- Amy (Ziyun) Zheng • Sina Siddiqi Mark Vella -- Sebastian Guerrero • Mounira Tlili •