Exploring Mobile Space Stanfy Publications. Mobile Application UI/UX Prototyping Process



Similar documents
Exploring Mobile Space Stanfy Publications. How to Conduct Quick Usability Tests for ios and Android Applications

USER EXPERIENCE TRAINING CLASSES New York City

INFORMATION TECHNOLOGY STANDARD

Mobile App Design ITP 340x (3 Units)

UX for Successful Products

What s behind door number three?

SASOL Young Explorer App Case Study

Print to Interactive Roadmap. with Patrick McNeil

NUR- Prototyping. Low Fidelity

Event Marketing On The Go: Bringing Artists & Fans Together

UI/UX Design and Project Management Portfolio. Ryan Vojir ( Voyer )

/// FRICTIONLESS BUSINESS USING I.T. TO STREAMLINE OPERATIONS

Suggestions of Prototyping Tool for Service Design Co-Creation

Mobile Applications Developer. MAIN PURPOSE OF JOB To lead the design, development and maintenance of Android, iphone and ipad applications.

DEPARTMENT of DIGITAL MEDIA / INTERNET SERVICES:

Website design & development process

Ad Specifications and Guidelines

DESIGNING A USER-FOCUSED EXPERIENCE

Sample Blog Articles!

Interactive Enterprise Applications for Web, Social and Mobile Media

HELP I NEED TO HIRE A USER EXPERIENCE DESIGNER

Announcements. Project status demo in class

A DIGITAL SOLUTIONS AGENCY Queen Anne Ave N. Ste. 337 Seattle WA,

Designing the User Experience

Intro to Human Centered Service Design Thinking

CMS, CRM, shopping carts, Web applications

WEB & MOBILE UI / UX ICON DESIGN ILLUSTRATOR

WEST VALLEY COLLEGE. Department of Digital Media. curricular profile & department information.

Easy Wireframing with

A GUIDE TO MOBILE

JAVIER GONZÁLEZ. User Experience Designer and Information Architect

We help companies make digital products and services that are used by people.

AUT OneDrive for Business. Instructions for Using OneDrive on Windows Platform

Kevin Suman. Contact: (310)

branding & design agency

The USER & The Design Process

Is to define and implement a design strategy with deep understanding of user and business needs that makes user interfaces and experiences great.

Claudio Gomboli Resume & selected works

GO MOBILE WITH SIGMA UKRAINE

Mobile App:IT. Mobile Apps & History

By Peter Merholz, If you use it, please attribute it. Thanks.

PROFESSIONAL DESIGN WEB DEVELOPMENT MOBILE SOLUTIONS CLOUD SERVERS

From App Idea to App Store. Trina Gregory University of Southern California

Google Analytics for Responsive Websites #edui_analytics

AXURE PROTOTYPING FOR DRUPAL

Spiel. Connect to people by sharing stories through your favorite discoveries

Samsung Mobile Apps Boot Camps 1

INFORMATION TECHNOLOGY STANDARD

USER EXPERIENCE DESIGNER & RESEARCHER

WEBSITE AND APPLICATION DESIGNER

BS 8878: A Summary

Paolo Alessandro Villa

Elliott Romano. UX Designer elliottromano.com

Some observations. Let s talk about prototyping. Who is this guy? EFFECTIVE PROTOTYPING A developer s guide to better design through prototyping

Our Process: Website Design & Development

Our online services Less paper. More efficient. group insurance

GENERIC AGENCY STATEMENT OF WORK. Website Redesign Project Generic Company

Vidyuth Subbaiah UX ARCHITECT

«Lo-fidelity» Prototyping

With 30% 60% of website traffic coming from a mobile device, it s a given

Andrew Hill USER EXPERIENCE DESIGN PORTFOLIO

Web Mapping Application Interface Design: Best Practices and Tools. Michael

Indie_App_Development() { // Arjun Gopalakrishna // Bhavya Udayashankar

Volker Max Meyer Senior Service Designer & User Experience Designer

Digital Channel Manager

BI DESIGN AND DEVELOPMENT

Pocket-sized fleet management. TomTom WEBFLEET Mobile Product kit

INDEX 1... INTRODUCTION 2...A PRACTICAL LOOK AT USING WIREFRAMES SHADES OF WIREFRAMES NON-DIGITAL WIREFRAMING WEAPONS

How To Use The Elena Mobile App

UX DESIGN: FOUNDATIONS FOR DESIGNING ONLINE USER EXPERIENCES

Application Development for Mobile and Ubiquitous Computing

Design. Darryl Brown! Mobile Development! 2b Design & Development

Apple Health. An amazing app that visualizes health data in a useful and informative way!** By Nic Edwards

Richard Halford Lead User Experience Designer

DESIGNING FOR THE USER INSTEAD OF YOUR PORTFOLIO

The Ultimate Guide to Mobile App Testing

Our goal is to develop premium digital product minus the typical agency bloat. At our core, we are

Outline Web Design Process

DESIGN THINKING IN A DAY

Digital marketing strategy

The Best Mobile App Development Platform. Period.

5 Steps to an Engaging Enterprise Mobile Strategy /

USER EXPERIENCE DESIGNER. Juan Cordoba. M: E: W: chibchadesign.com EXPERT REVIEWS A/B TESTING RESEARCH

United Way Mobile App

Release Notes: Onsight Connect for Android Software Release Notes. Software Version Revision 1.0.0

English and Spanish Barcelona

10 Great Reasons to Partner With a Digital Agency

Heads and Hands. is your product design and development partner that helps you to create complex web services and highly polished mobile apps.

Mobile Website Overview and Mobile Application Development Policy

Adobe Connect and Zoom are web conferencing tools with many features. Google Hangouts and Skype are primarily for voice calling or text chat.

Project Management. In this Guide

Building a Simple Mobile optimized Web App/Site Using the jquery Mobile Framework

The Future Of Mobile Design

USER EXPERIENCE DESIGN CASE STUDY

mportal Services Mobile App Design and Development mportal Services Mobile App Design and Development

Searching the UCI Library Website. Wael Alkowaileet, Boaz Gurdin, Yifan Ying, Qinglin Xia

Transcription:

Exploring Mobile Space Stanfy Publications Mobile Application UI/UX Prototyping Process

Prototyping is an important part of an iterative design process where each screen is refined until it achieves the desired level of performance and usability. Your future application goes through a series of interesting transformations, from a simple sketch to detailed prototype and then to the final design. Incorporating some form of prototyping into the design process is a critical step in creating great apps. When you have defined your app concept, understood the main use cases, and came up with the list of features, it is time to think about application user interface and user experience (UI/UX). With this paper we would like to share our approach in building experiences that seek to satisfy consumers. Stanfy Publications ABOUT STANFY PUBLICATIONS Stanfy is a mobile design and development team specializing in mobile UI/UX and native ios & Android app development. Since 2009 we ve been creating successful mobile apps for companies from different fields of business. We сlosely follow newest mobile trends in marketing, design and tech fields, constantly apply them in our work and share our findings with the mobile entrepreneurs community. With this publication we d like to share our experience in building mobile apps and the results of our internal investigations in mobile space.

Brainstorm UI/UX session together with the project team We start with a group brainstorming session. The project team gets together with the client, gathered in one room or via hangout, and they do a series of quick sketches of the 2-3 main app screens. Our aim is to produce a simple black and white sketch that shows the basic layout of the app. They are quick to produce and allows us to quickly test broad concepts of the app interface. The best way to conduct such brainstorming is to allow everybody to sketch his own ideas for 2 minutes, then present it to the group and discuss. Such an approach allows each participant to express his ideas freely, without pressure and influence from others. We found that this approach is the best way to get really cool and fresh ideas for UI/UX of the future application.

Quick iterations with paper for a UI/UX prototype As soon as you have your first paper sketches, iteratively revise and refine them. Such simple prototypes can reveal flaws in your design concepts and allows you to resolve these issues before more significant production commitments are made (such as creating a high-fidelity mockup or coding). Don t forget to conduct a quick user test somewhere in the middle of your discussion. Invite some of your colleagues who are not familiar with the project and ask them to perform some simple tasks. Whiteboard, markers, stickers and paper with the printed smartphone contours this is all you need at this stage. Especially for this case, we created printable templates with iphone, ipad and Android frames that will help you rapidly bring your ideas to life. Please feel free to download any template below and use it for rapid prototyping of your future ios or Android application (available both in International and US Paper sizes). http://stanfy.com/blog/iphone-ipad-ios-android-sketching-templates/

UI/UX application wireframes, design prototype These wireframes show layout and functionality but have no visual design. Such an interface prototype is close to the final application with many details and functionality and allows you to examine usability in details. At this stage, you need to produce all the key screens of your app and carefully think of the user flow. As usual, iterate quickly and do quick user tests. Revise the prototype based on the test results. This is the final stage of the design process when you add all the details into the designs and define the visual style of the app. This design prototype looks like a final product, and it could also work like a realistic app on your smartphone. Using such tools like Axure RP or Proto.io, you can make screens actually interact with each other like a digital app. Interactive design prototype works the best for validating UX design direction with the stakeholders.