Henrik Olsen's presentation from Web 2.0 Expo New York:
If you’re ready to jump into designing for tablets, this will be a great two-part workshop for you. Given the mass adoption of tablet devices over this past year,this workshop has been created to present the fundamentals of designing tablet applications as well as tablet optimized web sites. Learn from a leader in adopting classic design principles to the rapidly evolving world of tablets.
This primer on mobile accessibility will give you a solid grounding on standards, guidelines and principles of making websites accessible on mobile devices, and demonstrate some of the accessibility features available on iOS and Android.
This presentation was delivered at Digpen 7:
http://lanyrd.com/2014/digpen7/sdfcth/
DISCLAIMER: This is an archived presentation. Please visit http://www.slideshare.net/Digital-Luxury to access DLG official SlideShare account.
Considering the iPhone success and widespread adoption, IC-Agency decided to review the market of iPhone apps in the luxury industry.
This primer on mobile accessibility will give you a solid grounding on standards, guidelines and principles of making websites accessible on mobile devices, and demonstrate some of the accessibility features available on iOS and Android.
This presentation was delivered at Digpen 7:
http://lanyrd.com/2014/digpen7/sdfcth/
DISCLAIMER: This is an archived presentation. Please visit http://www.slideshare.net/Digital-Luxury to access DLG official SlideShare account.
Considering the iPhone success and widespread adoption, IC-Agency decided to review the market of iPhone apps in the luxury industry.
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...Fabien Marry
A in-depth look at the iPad user interface with guidelines and examples.
What's new, and what lessons were learned from theTablet PC concept and the iPhone own user interface.
If you think the iPad is just a bigger iPod, this presentation is for you.
Slightly updated from the presentation I made at UXCampLondon 2010.
If a website or mobile app is not accessible to all potential visitors, is it truly a quality product? Services, products, information, and entertainment on the web and mobile devices can be made available to millions of consumers with vision, hearing, or motor control difficulties by complying with accessibility standards. Assistive technologies enable access by converting the text and images of mobile screens and web pages into computerized voice. But these technologies cannot interpret pages that are not built and tested for compliance to accessibility standards and programming guidelines. Join Nancy Kastl to learn about Section 508 and WCAG standards, Mobile Web Best Practices, and Apple and Android Developer Accessibility Guidelines. Learn how to test for accessibility on mobile devices and desktop using screen readers and open source tools. Become an advocate of accessible mobile apps and websites throughout the project lifecycle and add accessibility testing to your testing capabilities.
Adobe Max Modern iPhone App Design with Rick MesserRick Messer
Modern iPhone App Design
Basic practices and modern techniques
An introduction to iPhone app design. Gain a foundation of basics to break into this medium and start designing apps. This session will cover some fundamental iOS principles and describe modern design techniques. Get equipped with a good starting point and avoid some rookie mistakes.
Some Pointers from a Mobile Product Design Agency
iOS Anatomy: Familiarize with terminology, patterns & controls
Examples of modern design techniques
Tips from our process at Funsize
Working with engineers
Modern tools & practices for prototyping
Presentation at the University of Denver for the Instructional Design and Web Development for Educators class.
October 11th, 2010
Recording at: http://vimeo.com/15766159
Mobile Application Development: Hybrid, Native and Mobile Web AppsPaul Sons
Orion eSolutions offer the best and the most reliable Hybrid, Native, Mobile Application Development services using the latest platform. To know mobile app development stages and usages visit orionesolutions.com
Introduction to mobile accessibility - AccessU 2013Henny Swan
Where do you start when making your content mobile?
This presentation tackles how people with disabilities use the mobile web and applications, putting together a mobile support strategy, responsive web design, iOS and Android development covering design, development and testing.
Intellectual property is the product or creation of the mind. It is different from other properties in term that it is “intangible”. Hence it needs some different way for its protection.
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...Fabien Marry
A in-depth look at the iPad user interface with guidelines and examples.
What's new, and what lessons were learned from theTablet PC concept and the iPhone own user interface.
If you think the iPad is just a bigger iPod, this presentation is for you.
Slightly updated from the presentation I made at UXCampLondon 2010.
If a website or mobile app is not accessible to all potential visitors, is it truly a quality product? Services, products, information, and entertainment on the web and mobile devices can be made available to millions of consumers with vision, hearing, or motor control difficulties by complying with accessibility standards. Assistive technologies enable access by converting the text and images of mobile screens and web pages into computerized voice. But these technologies cannot interpret pages that are not built and tested for compliance to accessibility standards and programming guidelines. Join Nancy Kastl to learn about Section 508 and WCAG standards, Mobile Web Best Practices, and Apple and Android Developer Accessibility Guidelines. Learn how to test for accessibility on mobile devices and desktop using screen readers and open source tools. Become an advocate of accessible mobile apps and websites throughout the project lifecycle and add accessibility testing to your testing capabilities.
Adobe Max Modern iPhone App Design with Rick MesserRick Messer
Modern iPhone App Design
Basic practices and modern techniques
An introduction to iPhone app design. Gain a foundation of basics to break into this medium and start designing apps. This session will cover some fundamental iOS principles and describe modern design techniques. Get equipped with a good starting point and avoid some rookie mistakes.
Some Pointers from a Mobile Product Design Agency
iOS Anatomy: Familiarize with terminology, patterns & controls
Examples of modern design techniques
Tips from our process at Funsize
Working with engineers
Modern tools & practices for prototyping
Presentation at the University of Denver for the Instructional Design and Web Development for Educators class.
October 11th, 2010
Recording at: http://vimeo.com/15766159
Mobile Application Development: Hybrid, Native and Mobile Web AppsPaul Sons
Orion eSolutions offer the best and the most reliable Hybrid, Native, Mobile Application Development services using the latest platform. To know mobile app development stages and usages visit orionesolutions.com
Introduction to mobile accessibility - AccessU 2013Henny Swan
Where do you start when making your content mobile?
This presentation tackles how people with disabilities use the mobile web and applications, putting together a mobile support strategy, responsive web design, iOS and Android development covering design, development and testing.
Intellectual property is the product or creation of the mind. It is different from other properties in term that it is “intangible”. Hence it needs some different way for its protection.
A patent is a set of exclusive rights granted by a state (national government) to an inventor for a limited period of time in exchange for a public disclosure of an invention.
Pass the i pad please - 5 Lessons for Creating Great Tablet ExperiencesAnswerLab
As the tablet market continues to grow, so does the need to keep pace with the interaction challenges and opportunities these devices provide. The tablet platform raises unique challenges for developing and testing digital experiences. As a guide for user experience professionals, developers, designers, and product managers, AnswerLab has identified three key trends across our tablet UX research and will provide five lessons for creating tablet experiences, as well as best practices for conducting tablet research.
Ibm worklight - going from xpages mobile to native mobile applicationsMark Roden
Abstract
In this session John and Mark will demonstrate how an XPages developer can make the simple, practical, logical evolution from XPages to IBM Worklight developer.
Have you ever wondered how to easily integrate a mobile phone native feature set with your corporate web applications? We will show that any XPages developer currently building mobile-accessible websites already has the skillset to build native mobile apps using IBM Worklight. We will cover installation, setup, similarities in designer clients, the test environment, the skills necessary and provide a working example.
You have the skills, you have the knowledge. Your only challenge is to come to the session and understand how to make this work. Go from HTML5 to native in minutes.
Addressing Mobile App Testing ChallengesLee Barnes
If the mobile technology train hasn’t arrived at your organization yet, it soon will. Are you ready to jump onboard and face the unique testing challenges presented by mobile applications? In this session, Lee will lead a journey to help you understand where mobile quality is, where it’s going, why it matters to you, and what you can do to help ensure mobile quality in your organization. Lee’s presentation will highlight testing challenges specific to mobile apps and present mobile testing best practices including techniques for leveraging test automation on mobile platforms. You will understand why testing in a mobile environment is different from traditional software testing and learn how to address the unique testing challenges presented by mobile applications. Attend this talk and walk away with a solid mobile testing baseline and best practices for addressing the challenges that lie ahead.
Whitehedge has deep experience in one of the most sought-after technology domains in the industry today: Mobile Development.
Sharing some of the interesting case studies to showcase our work in the mobile development field.
HTML5 or Android for Mobile Development?Reto Meier
Android apps or the mobile web? It's often a hard choice when deciding where to invest your mobile development resources. While the mobile web continues to grow, apps and app stores are incredibly popular. We will present both perspectives and offer some suggestions for making the most of each platform.
Building & Managing The Lifecycle of Mobile Apps For The EnterpriseApperian
This presentation covers the various options for creating mobile apps for iOS as well as other popular platforms including Android. The landscape is changing quickly, so we'll review everything from HTML5 web-only apps, cross-platform development tools, HTML-enabled "hybrid" apps, all the way to the full native XCode environment.
We'll cover best practices for managing the mobile app lifecycle from design, beta, rollout, update management, to retirement. We'll also see a demonstration of how to deploy and manage mobile apps in an "enterprise" or corporate environment for iOS and Android.
Originally presented at the Southland Mobile App Creators (SMAC) meeting November 9, 2011.
Prezentarea sustinuta de Pawel Glowacki a facut obiectul evenimentului organizat de Softline Romania in calitate de distribuitor si Embarcadero pe data de 5 septembrie la hotelul Howard Johnson din Bucuresti, în cadrul RAD Studio XE5 Tech Preview World Tour.
For those to have a quick in technical and business insight of android and to promote open source I am uploading this presentation that I have delivered in multiple institutions.
Exploring the right business strategy for open source mobile platformsAmanda Lam
As presented at the Hong Kong Open Source Conference.
"As presented in the HK Open Source Conference 2015.
The mobile industry has longer been dominated by two major ecosystems. While Windows and BlackBerry are fighting for the 3rd place in global market share, newcomers such as Firefox OS, Sailfish OS, TIZEN and Ubuntu on Phones are struggling to attract market attention and traction.
By performing strategic analysis on these platforms, certain critical success factors and how open source could help are identified and discussed."
I joined Autodesk one year ago to help transform the 33 year old company from product centricity to experience centricity. This is the plan I put in place.
Touching Stories: Designing Digital Magazines for the iPad (Matt Carlson)Autodesk
The launch of the iPad signaled the start of a new era for magazine publishing. A single device that delivered the fidelity of print and the interactivity of the Web, all wrapped up in a fun and easy-to-use form factor gave the industry new reason to hope. There was one trick: no one had designed for this brave new medium yet. Editorial teams suddenly needed to consider multi-touch gestures, multiple orientations, dynamic layout and the integration of rich media into the design of their issues. Ink-smudged print teams had to reach out to the pixel-based life forms in charge of the company websites, and engage a new breed of Cocoa developers as well. Whole new models of information design and user experience we're launched at high velocity into the App Store. Matt Carlson, Hot Studio's Principal of Strategy & Design, was involved in designing some of the first digital magazines that launched on the iPad on April 3rd, 2010. He has spent the last year exploring new ways to experience and engage with magazine content on this exciting new platform. He's worked on iPad editions of magazines such as Spin, Dwell, National Geographic, Car and Driver and many others. In this session he'll share hard-earned knowledge and useful insights on how to design for gestural interfaces, how to integrate interactivity smoothly into digital magazines, and what it takes to build an issue for the iPad.
BART, Bay Area Rapid Transit, shows how a government agency can use technology to be a provider not only of services—but also of information, data and spaces for building community.
Cause Marketing Kellogg Marketing Conference 090124Autodesk
We used these slides as a backdrop for our panel on Cause Marketing and Social Responsibility. Keecia Broy moderated the panel with Rajan Dev (Hot Studio), Rick Ely (Johnson & Johnson), Kathy Leech (BP), and Stephanie Wolcott (Kellogg Innovation Network Global)
Can't we all get along? Human-centered design meets AgileAutodesk
This presentation will describe and explore the differences between the two approaches, when it's appropriate to use agile development, how to integrate this popular method into the human-centered design and research process — and why client needs and today's marketplace increasingly are demanding these collaborative techniques.
You could be a professional graphic designer and still make mistakes. There is always the possibility of human error. On the other hand if you’re not a designer, the chances of making some common graphic design mistakes are even higher. Because you don’t know what you don’t know. That’s where this blog comes in. To make your job easier and help you create better designs, we have put together a list of common graphic design mistakes that you need to avoid.
7 Alternatives to Bullet Points in PowerPointAlvis Oh
So you tried all the ways to beautify your bullet points on your pitch deck but it just got way uglier. These points are supposed to be memorable and leave a lasting impression on your audience. With these tips, you'll no longer have to spend so much time thinking how you should present your pointers.
Unleash Your Inner Demon with the "Let's Summon Demons" T-Shirt. Calling all fans of dark humor and edgy fashion! The "Let's Summon Demons" t-shirt is a unique way to express yourself and turn heads.
https://dribbble.com/shots/24253051-Let-s-Summon-Demons-Shirt
White wonder, Work developed by Eva TschoppMansi Shah
White Wonder by Eva Tschopp
A tale about our culture around the use of fertilizers and pesticides visiting small farms around Ahmedabad in Matar and Shilaj.
3. Agenda:
• Who are we
• The hardware and operating systems
• Cool apps: top picks and why
• When & where an app makes sense - exercise #1
• Top 10 design considerations
BREAK
• Use scenarios - exercise #2
• Features & functions & content- exercise #3
• Gestures
• Tools for designers
• Task flows & dashboards - exercise #4
• Project team & ‘a process’
3
4. What are you hoping to learn, or
experience, in this workshop?
4
5. Who are we?
Who here has designed a tablet app before?
Who here is a professional web designer?
5
33. Motorola Xoom
Galaxy
iPad
RIM Playbook Kindle Fire
27
34. HP TouchPad with Android!
HTC Flyer (WebOS not totally dead)
Dell Streak
28
35. HP TouchPad with Android!
HTC Flyer (WebOS not totally dead)
Dell Streak
28
36. Smart use of device hardware! Cameras (front & back)
What are some
Accelerometer & Gyroscope
of the ways you
can use these Speaker
features?
Headphone jack
Microphone
Multi-touch color display (‘Retina Display’ iPad 3)
WiFi & 3G
Home & Volume & Locking buttons
Cover/stand
29
37. Smart use of device hardware! Cameras (front & back)
• Augmented Reality • Photo/Video • Optical recognition
What are some
Accelerometer & Gyroscope
of the ways you • Orientation • Motion detection • Speed based control
can use these Speaker
• Input response • Audio listening • Conferencing
features?
Headphone jack
• Private listening • Video conferencing
Microphone
• Voice/sound commands • Audio Recording
Multi-touch color display (‘Retina Display’ iPad 3)
• System & custom gestures • Custom gestures • Reading
WiFi & 3G
• Dynamic content • txt, email, video
Home & Volume & Locking buttons
• Dynamic content • txt, email, video
Cover/stand
• Sit back experience • Hands free viewing
30
46. What is cool?
Impact Context Craft
• Practical purpose of app • The geography, • Design of the UI.
situation, & culture in Presentation & emotional
• Positive impact on which the app lives content
people, society, the
environment & business • The relevance of the • Elegance in language,
problem it addresses, functionality & ease of
the timeliness usability
• Overall performance
39
47. Categories of apps
• Books & magazines
• Socializing
• Educational/learning
• Financial management
• Health & exercise
• Games
• Sports & Entertainment
• Business
• Music: listening and composing
• News and weather
• Travel
• Shopping
• _________?
40
54. Finding a need
• What does a person want/need to do?
• Is a tablet app appropriate for the context of the user?
Away from the o ce, home? (shopping, planning, playing, socializing)
45
55. Finding a need
• What does a person want/need to do?
• Is a tablet app appropriate for the context of the user?
Away from the o ce, home? (shopping, planning, playing, socializing)
• Content must fit the context
Can they access content, and data, ‘just at the right time‘
45
56. Finding a need
• What does a person want/need to do?
• Is a tablet app appropriate for the context of the user?
Away from the o ce, home? (shopping, planning, playing, socializing)
• Content must fit the context
Can they access content, and data, ‘just at the right time‘
• Is there an even larger opportunity?
Laptop, TV, mobile, tablet, appliance, as well as physical spaces.
(a digital eco-system!)
45
57. Finding a need
• What does a person want/need to do?
• Is a tablet app appropriate for the context of the user?
Away from the o ce, home? (shopping, planning, playing, socializing)
• Content must fit the context
Can they access content, and data, ‘just at the right time‘
• Is there an even larger opportunity?
Laptop, TV, mobile, tablet, appliance, as well as physical spaces.
(a digital eco-system!)
• Can it be useful, engaging, and intuitive... from the very first time!
45
59. Exercise 1: defining a need
1. What problem does it solve? What is the opportunity?
(what ‘un-met need’ have you identified)
46
60. Exercise 1: defining a need
1. What problem does it solve? What is the opportunity?
(what ‘un-met need’ have you identified)
2. Who are the people that will use it?
46
61. Exercise 1: defining a need
1. What problem does it solve? What is the opportunity?
(what ‘un-met need’ have you identified)
2. Who are the people that will use it?
3. Where is it used? In home, o ce, shopping, out & about?
46
62. Exercise 1: defining a need
1. What problem does it solve? What is the opportunity?
(what ‘un-met need’ have you identified)
2. Who are the people that will use it?
3. Where is it used? In home, o ce, shopping, out & about?
4. How does it get paid for? What is the business model?
46
63. Big idea example:
Example: Marathon Coach App
1. No great tablet apps that help people improve
their running performance.
People need a way to track and share their
data with coaches and/or friends, get advice
about techniques, work-outs, and equipment.
Create a training plans and evaluate progress.
2. For new and experienced marathon runners,
and coaches that have tablet, mobile & laptop
3. Home for planning, and at the track for
coaching and data capture
4. App is free, but charge for training plans,
coaching service, and advanced content.
47
64. Big idea example:
Example: Marathon Coach App
1. No great tablet apps that help people improve
their running performance.
People need a way to track and share their
data with coaches and/or friends, get advice
about techniques, work-outs, and equipment.
Create a training plans and evaluate progress.
2. For new and experienced marathon runners,
and coaches that have tablet, mobile & laptop
3. Home for planning, and at the track for
coaching and data capture
4. App is free, but charge for training plans,
coaching service, and advanced content.
You’ve got 10 minutes.... go!
47
66. Consideration: 10
Consistent interactions
Take advantage of what
people already know!
• Established user
interactions should be
used... unless, an interaction
requires something truly
unique
• Carefully consider when
conforming or diverging
from the native iOS UI
elements
49
67. Consideration: 10
Consistent interactions
Take advantage of what
people already know!
• Established user
interactions should be
used... unless, an interaction
requires something truly
unique
• Carefully consider when
conforming or diverging
from the native iOS UI
elements
49
68. Consideration: 9
Direct manipulation
• Allow users to manipulate
objects directly on the screen
• Avoid editing palettes — and
typing
• Don’t overload the user with
irrelevant options (keep it
simple: hide anything that
doesn’t apply)
Image ‘borrowed’ from Ron Peterson
50
69. Consideration: 9
Direct manipulation
• Allow users to manipulate
objects directly on the screen
• Avoid editing palettes — and
typing
• Don’t overload the user with
irrelevant options (keep it
simple: hide anything that
doesn’t apply)
Image ‘borrowed’ from Ron Peterson
50
70. Consideration: 8
A ordances
There are no rollovers on tablets - links,
buttons, and all other controls must have
plenty of a ordance
• Fingertips are larger than mouse
cursors
51
71. Consideration: 7
Behaviors & Transitions
User feedback is critical. Tablet UI’s are
expected to be responsive. When a user
does something, the interface should
acknowledge the input.
transition animation — gesture animation
52
72. Consideration: 7
Behaviors & Transitions
User feedback is critical. Tablet UI’s are These are the little
expected to be responsive. When a user
does something, the interface should things that make it fun!
acknowledge the input.
transition animation — gesture animation
52
73. Consideration: 7
Behaviors & Transitions
Aspects to consider:
• How does it start and end?
• What arc does it follow?
• What are the levels of opacity?
• Does it flip?
• Does it rotate?
• Does it pulse?
• Does it wiggle?
53
74. 3. Opening/Closing Stacks
This direction takes a different approach than the first for stacks. Tapping on a stack...
78. This stack can be closed by tapping the “Back to [courseName]” button in the upper right corner. Here, it is
shown with vertically scrollable content, but the size of the stack window could be made to vary to
accomodate up to a certain number of child objects.
80. Consideration: 6
Resolution & screen dimension
Accommodating resolution of the device. Plus, how
does it compare to your authoring environment?
60
81. Consideration: 6
Resolution & screen dimension
Accommodating resolution of the device. Plus, how
does it compare to your authoring environment?
A few details:
• Your assets will need to be both 163 ppi AND 326ppi for
retina display. (and 72dpi for desktop displays)
• Need high-resolution versions of bitmaps - or use vectors
(adding @2x to the ends of your image names)
• Image compression has to be done carefully due to high
rez screens
• Web based apps should have liquid interfaces to
accommodate variety of device screen dimensions
61
82. Consideration: 6
Resolution & screen dimension
Accommodating resolution of the device. Plus, how
does it compare to your authoring environment?
62
83. Consideration: 5
Layout flexibility
Are the functions, and content making the best
use of the device orientation?
• Work mode common in landscape. Lean-back
read in portrait
• ‘Responsive web’ design (new CSS & JS
standards support SVG and bitmap)
63
84. Consideration: 4
Involve your users!
Understand their needs &
tasks
Spend time showing your concepts
and prototypes to your target users.
• What is the user trying to do?
• Analyze the users tasks and needs
and keep your design focused
64
86. Consideration: 2
Content delivery
Keep your app alive with fresh content.
You must know the source of the data.
• Is your app connected?
• Does it rely on live download?
• Early on, you must know and secure
your data source. (Open API, proprietary
content, partnerships, etc.)
66
87. Consideration: 1
Backwards compatible
Is your app on supported devices
Does your app require device
hardware that is not available on
earlier versions of the device
67
92. Storyboard context
App is just part of a bigger
experience.
Storyboarding the scenario:
• Before — During — After — Repeat
• The ‘eco-system’ around your app
72
96. Exercise 2: Storyboard context
Illustrate, as a storyboard, the full context of a person
using your application. (location, people, situation, etc.)
Consider:
• Where they are in their day?
• With whom they are interacting?
• Are there other devices to sync with?
• Is the data saved or shared or downloaded?
76
101. Exercise 3:
The core features and
content of your app
• Yellow sticky = a feature
• Orange sticky = a content ‘type’
80
102. Exercise 3:
The core features and
content of your app
• Yellow sticky = a feature
• Orange sticky = a content ‘type’
You’ve got 12 minutes.... go!
80
112. Tools used for designing a tablet experience
Experience Design
• Whiteboard & sketch paper
• Visio
• OmniGra e
• Illustrator
• InDesign
113. Tools used for designing a tablet UI
Experience Design
• Whiteboard & sketch paper
• Visio - from MicroSoft
• OmniGra e
• Illustrator
• InDesign
90
114. Tools used for designing a tablet UI
Experience Design
• Whiteboard & sketch paper
• Visio
• OmniGra e 5
• Illustrator
• InDesign
91
115. Tools used for designing a tablet UI
Experience Design
• Whiteboard & sketch paper
• Visio
• OmniGra e 5
• Illustrator
• InDesign
92
116. Tools used for designing a tablet UI
Experience Design
• Whiteboard & sketch paper
• Visio
• OmniGra e 5
• Illustrator
• InDesign
93
117. Tools used for designing a tablet UI
Visual Design
• Sketch Paper!
• Photoshop
• LiveView
• AfterE ects
• Fireworks
94
118. Tools used for designing a tablet UI
Visual Design
• Sketch Paper!
• Photoshop
• LiveView
• AfterE ects
• Fireworks
95
119. Tools used for designing a tablet UI
Visual Design
• Sketch Paper!
• Photoshop
• LiveView
• AfterE ects
• Fireworks
96
120. Tools used for designing a tablet UI
Visual Design
• Sketch Paper!
• Photoshop
• LiveView
• AfterE ects
• Fireworks
97
121. Tools used for designing a tablet UI
Visual Design
• Sketch Paper!
• Photoshop
• LiveView
• AfterE ects
• Fireworks
98
123. Why Prototype?
• Allows you to fine tune you ideas and interactions
(Revealing those unexpected gaps)
Iterative design process:
ideas make learn validate
99
124. Why Prototype?
• Allows you to fine tune you ideas and interactions
(Revealing those unexpected gaps)
• Bring your ideas to life.... quickly sketching
Iterative design process:
ideas make learn validate
99
125. Why Prototype?
• Allows you to fine tune you ideas and interactions
(Revealing those unexpected gaps)
• Bring your ideas to life.... quickly sketching
• See the choreography of your transitions and screen states
Iterative design process:
ideas make learn validate
99
126. Tools for prototyping
GoodReader (PDFs) Picture Link - iPDF MinimalFolio
+ + ‘Wallaby’
Apple Keynote Fireworks Flash coming
Catalyst soon:
100
134. Development - very briefly!
Important:
Make friends with a developer!
Someone who can work with Apple’s
Software Development Kit (SDK):
Xcode 4 (development environment)
- Interface Builder
- Instruments
- iOS Simulator
- See: developer.apple.com
105
144. Sketching
Magazine App for iPad
features:
Help Log In
- Show new magazine titles
- Magazine shop
- Library of users
magazines
Featured User will
swip through
- Show upcoming events -
Magazines a variety
of covers
calendar
<- Cover shots -> - User generated content
(reviews, comments, etc)
- Facebook integration
- Twitter stream
Your Full Facebook
Library Magazine Shop Twitter User can post
to FB if they
User can like an article or title.
get to the Or, they can tweet if
magazines they they an interesting
already own point
114
145. Exercise #4: Features & Functionality mapping
Step A:
Organize the content and functions onto the provided ‘Post-its’—
organize them on the blank sheet(s)
Step B:
With pencil, sketch on the ‘paper iPads’ the ‘main’ screen layouts
— with appropriate functions & content.
115
146. Exercise #4: Features & Functionality mapping
Step A:
Organize the content and functions onto the provided ‘Post-its’—
organize them on the blank sheet(s)
Step B:
With pencil, sketch on the ‘paper iPads’ the ‘main’ screen layouts
— with appropriate functions & content.
You’ve got about 15 minutes.... go!
115
147. Who wants to share what
they’ve come up with?
116
149. The team
Collaboration of a Project Manager
multi-disciplined
team is critical User Experience
Visual Designer
Content Users
Engineer
Client
118
150. Process (waterfall)
User Experience Visual Design Engineering
Project Management
Discovery Strategy Design Build
• Customer / Market • Persona development • Screen schematics • Style guide
Research • Content needs analysis • Visual design • Manage dev team
• Stakeholder interviews • Feature prioritization • User testing • Collaborate with
• Key schematics & IA • Design refinement dev team
• Existing apps audit
Visual design workshop • Design extension • QA & testing
• Interview target users
• Business & technical • Development throughout the
• Competitive audit planning
requirements development
• Technology discovery • User concept testing process
119
151. Sample of project flow for simple tablet app
• Conduct a Discovery work session to understand you business and design
goals for the project
• Review your content offering and develop a design approach that best
leverages content
• Conduct an evaluation of 5-7 competitors and/or other brands
• Develop an interaction model for the content and high level interaction design
• Wire frame review over the course of our strategy and design phases
• Several visual design concepts that reflect a range of approaches
• Based on the selection of 1 of the visual design directions extend that direction
across the additional screens and dialogs the application will require.
• Work with developer during development
120
153. A few reasons for rejection from Apple App Store
122
154. A few reasons for rejection from Apple App Store
• Not following Apple’s Interface Guidelines
• Lack of rights to content or brands presented in your app
• Insu cient error messaging. Spinning ball does not su ce!
• Political lampooning
• App crashing
• Violating patented UI patterns... coverflow, for example
• Contests and/or sweepstakes
• Poor handling of user info
• Apps that are primarily for serving ads
• Objectionable content... nudity
• Transactions outside the app store
122
155. Thank you!
Hot Studio Inc.
585 Howard Street
1st Floor
San Francisco, CA 94105
415.284.7250
520 Broadway, 8th Floor
New York NY 10012
212.242.1082
hotstudio.com
hottub.hotstudio.com
twitter.com/hotstudio
facebook.com/hotstudio