Noel Holmes User Experience Portfolio 1 Of 2
Transcript of Noel Holmes User Experience Portfolio 1 Of 2
![Page 1: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/1.jpg)
Noel Holmes – User Experience
Noel Holmes&User Experience
(Portfolio 1 of 2)
Last update: 3/2//2009Noel Holmes • User Experience
[email protected] • 512.484.4195A grate user experience?
![Page 2: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/2.jpg)
The trick is… getting the experience right.
Magic Slide
Why is great design like a good magic trick?
![Page 3: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/3.jpg)
Noel Holmes – User Experience
Case Study: LeisureplanetPosition: Director – Executive Producer
When: Jul 1999 – Aug 2000
Visual DesignFront-End DevelopmentInformation Architecture
ContentProduction
Managing across roles, offices, countries and cultures
The Trick is…
![Page 4: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/4.jpg)
Noel Holmes – User Experience
Leisureplanet - Before
Know the Goals• Make
Leisureplanet THE travel site in Europe
• Launch localized sites for 20 countries – ALL AT ONCE
• Tap into travel aspirations –
“From the Dreamto the Memory”
Getting agreement on the goals and sharing the visionThe Trick is…
![Page 5: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/5.jpg)
Noel Holmes – User Experience
Leisureplanet - After
The Trick is…
Know the Roles• Headquarters in
Belgium• Technology group
in South Africa• Front-end Dev in
Amsterdam• Translation
providers in U.K.
Know (and love) the technologygroup
![Page 6: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/6.jpg)
Noel Holmes – User Experience
Leisureplanet - Evolved
The Trick is…
Know the users• Localizing site
meant understanding needs (including rules and regulations) AND culture
• Hired producers native to each country’s site
Hire the right people and research the users!
![Page 7: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/7.jpg)
Noel Holmes – User Experience
Guiding the Focus
Focus?
Experience
Merchandising the Experience
![Page 8: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/8.jpg)
Noel Holmes – User Experience
Translation Strategy
Translation Service
Tier 3
Tier 2Business Logic
User Interface
Front End
com objectcom object
Site Server
.com
.de
.fr
.uk
...
GDS
DanishDutchEnglish FinnishGerman
IBE
ItalianNorwegianPortugueseSpanishSwedish
Tier 1Business Logic
SQL 80 Guides102 Others
en +5 + CT
en +10
Flight Rules
Website Content
Travel Guides
CTTranslators
FIGS
Hotel DataCT
DB TeamCT
Edit Team
1
2
3
4
Set up processes to ease flow and accelerate productionThe Trick is…
![Page 9: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/9.jpg)
Noel Holmes – User Experience
Dream & Experience
Know and convey the brand essenceThe Trick is…
![Page 10: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/10.jpg)
Noel Holmes – User Experience
Online identity guidelines
Non-clichéd presentation
Direct address to users
Strong titlesborntobeWilde Wayne’s dream is…
To visit the favorite watering holes of Dublin's greatest writers.
Magazine-like features
Photos of people, not simple postcard shots
Yet colour photos where best - hotel slides, travel guides
Geometric frame provides coherence, echo of logo, and increased flexibility for photo selection
Photos should:Prioritize the following keywords -emotions, vacation, experience, the senses, pan-ethnicity, pan-generational…
Get the foundation right before extending too farThe Trick is…
Pyramid writing…nutshell intros, hyperlinks, FAQ, etc.
![Page 11: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/11.jpg)
Noel Holmes – User Experience
No “leisure” in leisureplanet
In 12 months…• Launched Sites in 12
Countries– Six Languages
• Designed Sites for Multiple Cultures
– Hired producers native to each country’s site
• Managed Teams in Five Countries
– Belgium (HQ), South Africa (Dev), U.K. (Translation), U.S. (WebSphere), and Holland (Vignette)
• Met Needs of Multiple Partners
– CNN, Y! France & Y! Germany, Infospace and Lycos
![Page 12: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/12.jpg)
Noel Holmes – User Experience
Case Study: ProdigyPosition: Director - User Interface Design
When: Jan, 2001 – Mar, 2002
User Research Visual Design
Information ArchitectureAccessibility
Creating a brand new application and a web site to match… in 7 monthsThe Trick is…
![Page 13: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/13.jpg)
Noel Holmes – User Experience
Project Leapfrog Building the New Prodigy
![Page 14: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/14.jpg)
Noel Holmes – User Experience
Introducing Leapfrog…
The Problem…Prodigy had lost market and mindshare to competitors as an Internet Service Provider (ISP).
The Solution…Build a product that would integrate Prodigy’s applications in a revolutionary way that had not been done in the market; one that would position Prodigy as the product-leading ISP.
![Page 15: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/15.jpg)
Noel Holmes – User Experience
The Goals
What were the goals for Project Leapfrog?
•Replace old/incompatible software– Three major operating systems had been released since
Prodigy’s last major software release
•Build an Integrated Application– Put all current and future applications into one seamless
environment
•Build a Framework for the Future– Build a solution that would accurately reflect Prodigy’s
brand
•Build a Real-world Solution– Build a software utility that would solve real needs for real
people
![Page 16: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/16.jpg)
Noel Holmes – User Experience
Our Considerations
– Short Time Frame (6 months)
– Minimized Staff
– Improve Existing or Build New
![Page 17: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/17.jpg)
Noel Holmes – User Experience
Our Approach
With very little time to conceive, design, implement, test and launch several major applications, we knew we had to…
– Get Skilled People• Contract a Design Company• Staff Up Internal User Experience Team
– Put a Solid Process In Place– Make Vision Clear– Do Everything at Once
![Page 18: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/18.jpg)
Noel Holmes – User Experience
The Product
• Prodigy 7.0 was composed of the Connection Manager the Console and six applications.
Connection Manager “The Console”
CalendarContacts
Messenger Media Player
Browser
![Page 19: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/19.jpg)
Noel Holmes – User Experience
The User Experience
In line with the overall company direction, Prodigy 7.0 took major steps forward in improving the User Experience
– PDA Metaphor– Tactile– Garden with a Gate– Unified Look & Feel
• Web to Console• Web Application to Client Application• Application to Application
– Broadband “Always On”
![Page 20: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/20.jpg)
Noel Holmes – User Experience
The Process
Requirements
Existing Apps
User Research
Text
HTML
Core Team
Flows &Wireframes
Visual & SoundDesign
UI team& frog,
VisualComps
WebOps
Coding
Dev
Testing
QA
![Page 21: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/21.jpg)
Noel Holmes – User Experience
User Research
Lilly’s buddy categories are ‘Best Buds’, ‘Acquaintances’, and ‘Guys’. Her family members aren’t on her list. “My Dad tried it for a while, to be cool, but I think he gave up.” Lilly likes IM because you can do other things at the same time—go eat, talk with someone else, do homework, etc. She also likes it better because she feels she can express herself more easily there.
“It’s easier to ask someone out on a date on IM than on the phone. It’s easier to take a ‘no’. You feel more detached… [And] It’s easier to tell someone you don’t like them—you don’t have to see their face.”
IM Email
66% 17%Teens
Adults 33%17%
People vary in their choice of Internet ‘habitat’. Some favor email. Others use IM, an equal balance of IM and email, or chat.
Study Example
![Page 22: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/22.jpg)
Noel Holmes – User Experience
User Research
People want to handle interruptions gracefully, at the time they occur. Comfort level with interruptions varies.
Recommendations: 1) Give users control (in settings) over the handling of messages that come in while they are on another IM; 2) Offer a message handler that shows a summary of active and waiting IMs.
Many teens like IM because they can use it to talk to several people at one time, or do other things. One adult described using an IM as like using the phone. He feels it is rude to leave one IM to respond to another (he dislikes call waiting for this reason). He feels conflicted when an IM arrives and he is already on another IM.
Maximum # of IMs active at one timeAverage for teens: 4.5Average for adults: 1.6
Teens Adults Total
% Of conversation that are serial and discrete (one at a time) 39 72 55.5
% Of multi-tasked, intermittent conversations 61 28 44.5
Results and Recommendations Example
![Page 23: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/23.jpg)
Noel Holmes – User Experience
The Requirements
![Page 24: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/24.jpg)
Noel Holmes – User Experience
The Flows
![Page 25: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/25.jpg)
Noel Holmes – User Experience
The Wireframes
![Page 26: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/26.jpg)
Noel Holmes – User Experience
The Visual Comps
![Page 27: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/27.jpg)
Noel Holmes – User Experience
The HTML
![Page 28: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/28.jpg)
Noel Holmes – User Experience
The Testing
![Page 29: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/29.jpg)
Noel Holmes – User Experience
The Interfaces
![Page 30: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/30.jpg)
Noel Holmes – User Experience
Internet Console: Browsing the WebA new managed web browser, makes browsing easier
![Page 31: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/31.jpg)
Noel Holmes – User Experience
Internet Console: Multi-tab Browsing
Multiple tab browsing without losing your place
Introduced multi-
tab
pre-Firefox and 5
years before IE
multi-tab
![Page 32: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/32.jpg)
Noel Holmes – User Experience
Internet Console: Client Email
Integrated mail client, to make browsing– emailing a snap
![Page 33: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/33.jpg)
Noel Holmes – User Experience
Internet Console: Instant Messenger
New look for PIM brings the Console and IM together
![Page 34: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/34.jpg)
Noel Holmes – User Experience
Internet Console: Lock-out WindowLock-out Window with screen saver
![Page 35: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/35.jpg)
Noel Holmes – User Experience
Internet Console: Integrated Media Player
Listen to music while you browse or email.
![Page 36: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/36.jpg)
Noel Holmes – User Experience
Internet Console: Project Malibu
Web and Desktop integration, creates seemless experience
![Page 37: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/37.jpg)
Noel Holmes – User Experience
Portals - from 3 to 1
dial.net
dsl.net
.com
![Page 38: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/38.jpg)
Noel Holmes – User Experience
styleguide
![Page 39: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/39.jpg)
Noel Holmes – User Experience
Accessibility
Creative Alt Tags
Logical Tabbing
![Page 40: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/40.jpg)
Noel Holmes – User Experience
Accessibility
90% Compliance for web portal, 70% compliance for client kit
0
10
20
30
40
50
60
70
80
90
Aug-01 Sep-01 Oct-01
Console
Portal
Perc
en
t C
om
plian
t w
ith
P
riori
ty O
ne
![Page 41: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/41.jpg)
Noel Holmes – User Experience
Accessibility
Highest accessibility ranking compared to other ISPs
0
10
20
30
40
50
60
70
80
90
AOL MSN Earthlink Yahoo! ProdigyPerc
en
t C
om
plian
ce o
n P
riori
ty O
ne
![Page 42: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/42.jpg)
Noel Holmes – User Experience
Teams & Leadership
ListeningMotivating
CollaboratingInspiring
Recognizing
Hire the best and brightest and help them continue to be.
The Trick is…
![Page 43: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/43.jpg)
Noel Holmes – User Experience
YouTube clip. My Hands Are Bananas UI Team = Thought Leaders “We are ze monkeys”
![Page 44: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/44.jpg)
Noel Holmes – User Experience
Building the UX Team @ Travelocity
• Broken process• Visual Designers w/ HTML was the only role• Added User Research
– Gained trust
• Evangelized Information Architecture then Added Role – Gained trust, Integrated into Process
• Added Front-End Technologists– Gained trust, Integrated into Process
• Built Dependencies
![Page 45: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/45.jpg)
Noel Holmes – User Experience
Principled /Values
More Friends More Diverse
Respect Intelligence
Optimistic /Positive
Internet Natives More Choices
Format Agnostic
Balanced Lives Adaptive / Flexible
Civic Minded
High Expectations
Collaborative Nomadic Gamers Experiential
Independent Confident Direct More Liberal
Multi-taskers Inclusive Patriotic Entrepreneurial
Healthy Lifestyle Family Oriented Graphical Achievement Oriented
Credit: Richard Sweeney, NJIT
Motivating Millennials
Leadership / Teams
![Page 46: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/46.jpg)
Noel Holmes – User Experience
What this means for you…
Noel Holmes brings you…
• Experienced leadership for growing rockstar
teams
• A practiced user experience
evangelist/salesperson
• Strong inter-office Coordination
• Broad range of hands-on product design across
multiple channels
• Engaging public speaker/presenter
![Page 47: Noel Holmes User Experience Portfolio 1 Of 2](https://reader033.fdocuments.us/reader033/viewer/2022052602/55c3ba55bb61ebf66d8b45b4/html5/thumbnails/47.jpg)
The trick is… getting the experience right.
Magic Slide