Mobile Interface Design

lesson-plan-dg-11
Module Description

This module will provide students the opportunity to explore the visual and interactive aspects of mobile interface design. How can mobile interfaces be more effective and gratifying in consideration of their screen sizes, gestural control, location aware contexts and connectivity? The world of mobile application development is now accessible and widely available through a variety of digital tools, platforms and distribution systems that require new thinking and skillsets.

This module will guide students through a process of app design that begins at idea generation and culminates in high fidelity software prototyping. By taking a hands-on approach to learning with physical and digital tools, both online and in the classroom, this module offers a practical approach to making and understanding design for mobile interfaces.

Module Level:
Introductory - requires no prior knowledge.

Complimentary Modules:
Interaction Design: Basic Principles

Learning Outcomes

By the end of the module students will be able to:

  • ideate and articulate interactive design concepts in visual and written forms;
  • generate communication documents such as briefs, diagrams and wireframes;
  • actualize functional prototypes of interactive design concepts.
Suggested Learning Activities and Assignments

Through a sequence of online lectures, expert interviews, focused readings and video demonstrations, students apply their own knowledge and skill set in developing an individualized mobile design project.

App Analysis: Students search existing apps that address particular needs and problems. By analyzing current mobile applications from multiple perspectives (visual design, content, interactions, utility), students identify prevailing designs to learn what they do well – also why and where they fall short.

Visual Mapping: Students diagram a mobile app describing the hierarchy through a typical use case scenario. User navigation and task flows are coordinated and mapped using wireframes to structure the proposed functions and content.

Interactive Prototyping: Students translate static wireframes into a series of interactive screens that are semantically and functionally connected. User interface elements (tab bars, menus, icons, controls, etc.) form a consistent visual language across the app design.

COMING SOON


David Gelb (York University) is an Associate Professor in the Department of Design. He also serves as the eLearning leader for the School of the Arts, Media, Performance and Design (AMPD). He is the co-author of “Course Co-Creation vs. Course Management: Wikis as a Potential Alternative to Traditional Learning Management Systems,” in Wired for Learning (2010). David also co-leads a three-year initiative integrating eLearning in AMPD funded by the University Academic Initiative Fund.