Interactive Lab Wizard - iPad App

Designed a game setup wizard for an interactive lab at a conference. This wizard walked the user through setting up and testing an attached wand that would later be used in the game.

Role.png

Role

UX Strategist

-g-Process.png

Process

Foundational Knowledge

Concepts

Interaction Design

Visual Design

Tools.png

Tools

Whiteboard

Paper & Pencil

Sketch

Zeplin

GOAL

Design a simple wizard with clear instructions to setup a game for an interactive lab at a conference.

FOUNDATIONAL KNOWLEDGE

This is the first step to creating a compelling UI. It is essential to understand what the product offers, it’s roadmap, business drivers, competition, and users. Services provided for this project included: Stakeholder Interviews

CONCEPTS

Based on a products needs and a defined set of experience priorities, concepts are developed around task flow, navigation, and screen layout. The concepts cover the primary use cases so that we can see how the system will behave at a macro level. Services provided for this project included: multiple rounds of Concept Wireframes.

 
Clipboard.png

DESIGN OBJECTIVES

  • Keep workflow as simple as possible

  • Ensure wizard steps and instructions are clear

  • Apply modern design elements and styles

 

CONCEPT WIREFRAME SAMPLES

Test Screens

 

Capture Screens

INTERACTION DESIGN

This stage is where the concepts become reality. While adhering to technical restraints, ISO and industry-specific guidelines an experience is crafted which is both usable and complaint. All features and functionality will be documented in detailed wireframes that help ease the transition from product definition to development. Services provided for this project included: Detailed Design Wireframes

VISUAL DESIGN

During the visual design phase artwork and graphics are applied to the interaction design. Clarity and meaning are brought to the user experience by carefully crafting visual themes, color schemes, typography, and icons. Services provided for this project included creating: Visual Theme Exploration, Screen Renderings, Graphical Interface Elements, Icon Designs, and Style Guides.

VISUAL THEME EXPLORATION

Dark A

Light A

Dark B

Light B

 

VISUAL DESIGN SAMPLES

STYLE SHEET

 
Previous
Previous

Calibration Device - Touchscreen UI