Jayson Elliot Portfolio

Jayson Elliot
User Experience Director
jayson.elliot@gmail.com
@jaysonelliot
Executive UX Director, built and led departments for G2, Greater Than One, and Wunderman Founded Permission magazine in 1992 Built PG&Es rst web site in 1995 Information architect since 1997
Jayson who now what now?

jayson.elliot@gmail.com @jaysonelliot
Heres whats in this document
Brands Ive worked on A few case studies My approach to user experience A framework for creating experiences Steps in the framework, illustrated by examples
@jaysonelliot
Brands Ive worked on

A selection of brands from 1995-present
Case Study: Preferio

A personalized catalog, lled with products from your own email inbox
@jaysonelliot
Preferio
Preferio is a startup founded by Jayson Elliot, Mushter Moin, and Zia Karim in 2012. Our launch product is a personalized catalog app for the iPad that is populated by products found in your email inbox. Once the user connects their existing email account to their Preferio account, our service scans their inbox, nding matches with known retailers from our own database. We archive the shopping emails to hide them from the users inbox, and reveal them in our iPad app as catalog pages. The user can ip through the catalogs while the products are displayed independently, making it fun and easy to see the latest deals. Users can follow their favorite merchants, set alerts for the kinds of deals they dont want to miss, and share what they discover with their friends and family. We de-clutter your inbox while helping you nd the deals you were looking for in the rst place.
@jaysonelliot
www.preferio.com
Case Study: Humira

Helping arthritis patients manage their condition and communicate with their physician and family
Humira
Humira is a biologic that targets TNF, the cause of many problems associated with autoimmune disorders like rheumatoid arthritis (RA), Crohns disease, and psoriasis. The nature of the product makes patient compliance a problem. Especially in the case of RA sufferers, cloud of symptoms, comorbidities, and therapies, as well as poor memory, makes it difcult to focus on Humira. The SmartShare app was created by Wunderman and IDEO for Abbott Laboratories to help new Humira patients track their progress during the rst 4 months of therapy. It provides feedback to the patient and wirelessly transmits a report for the doctor. Through extensive patient and physician research, we created a tool that helped RA sufferers share their experience with not just their doctor, but their loved ones, helping create a more empathetic support structure and better outcomes.
10
www.MyHumira.com
11
www.MyHumira.com
Case Study: Wizards of the Coast

Connecting avid gamers with ofcial events and the wider community
12
@jaysonelliot
Wizards of the Coast

Wizards of the Coast is the company behind two of the most popular tabletop games in the world, Dungeons & Dragons and Magic: The Gathering. Gamers throughout the country gather regularly to play these games at conventions, game stores, and other locations. A major part of Wizards strategy lies in the promotion of these games through the Wizards Play Network. Unfortunately, nding where and when to play was difcult for their audience. Following in-depth user research with game store owners and gamers, we created mobile and desktop tools that allow gamers to quickly and easily nd events in their area or nationwide. The tools had to be attractive to the casual gamer, but powerful enough for the hardcore tournament players to use on a regular basis.
13
@jaysonelliot
14
www.wizards.com
Case Study: Campbells Soup

Bringing previously disconnected brands into a cohesive family experience
15
Campbells Soup
Campbells Soup Company has many product lines that were arranged in a byzantine array of microsites and architectures. We audited their experience and studied users to understand their mental models of Campbells as a product family and company. The realities of campaign cycles meant that different business units had to launch at different times, and needed the ability to maintain their own promotions. The resulting site made it easier for customers to nd what they were looking for, while giving each sub-brand room to express their own identity and promote themselves autonomously.
16
@jaysonelliot
17
www.campbellsoup.com
Case Study: Land Rover

Build and price your Land Rover
18
@jaysonelliot
Land Rover
Land Rover was re-launching their web site in four continental regions simultaneously, and preparing for the debut of their rst new model line in over a decade. Working in concert with our London and New York ofces, I led the UX team to create the North America consumer site, a templated system for Land Rover dealers sites, mobile consumer sites and an iOS app for owners, a social media campaign, and a build-and-price congurator that was all new from the ground up. We conducted primary user research to understand how customers used car congurators, and most importantly, when and why. Through repeated prototyping and testing, we built a solution that made it easy to visualize your Land Rover while engaging in a playful but detailed customization.
19
@jaysonelliot
20
www.landrover.com
Case Study: Sunovion

Multi-channel pharmaceutical campaign for Omnaris allergy spray
21
@jaysonelliot
Sunovion Pharmaceuticals
A nasal spray for allergies isnt the rst place youd expect to nd funny viral videos, mobile apps, or write-ups from Gizmodobut thats what happened with Omnaris. The challenge was to launch a new prescription medicine from Sunovion (then Sepracor), engage patients, and get them to spread the word. We combined the power of humor and fun with the power of real utility. Viral videos with the Allergy Dudes were one element, but the real killer app for Omnaris was an iPhone app that rates allergy threats in your city, lets you know what types of symptoms youre likely to encounter, and reminds you when its time to rell your Omnaris prescription. The site won several awards, including the Gold from International Creativity Awards and MM&M, and the Web Marketing Associations Outstanding WebAward.
22
23
www.omnaris.com
Case Study: Nationwide

Finding out whats right for me easily online
24
@jaysonelliot
Nationwide Insurance
As the AOR for Nationwide, I led many projects across all business units and channels, including direct mail and CRM retention initiatives, an innovative use of SMS (text messaging) to deliver an interactive retirement planning experience, administrative interfaces for agents to better serve their customers, banking solutions (did you know Nationwide was also a bank?), and a self-service tool for users to nd the right insurance for their individual needs. Known internally as Whats Right for Me?, we iterated through several rounds of UX concepting and prototyping, helping Nationwide discover their own goals as well as the user goals we would have to serve.
25
@jaysonelliot
26
www.nationwide.com
Case Study: EMD Serono

Using social media and video bloggers in unbranded pharma
27
@jaysonelliot
How I Fight MS
EMD Serono, the biopharmaceutical arm of Merck, needed to pave the way for a groundbreaking new drug that stood to change the face of multiple sclerosis treatment. I led the user experience for an unbranded site that, in its own small way, broke new ground for marketing pharma online by using real people, in real time, as video bloggers. The site was built using HTML5 and CSS3 for the widest compatibility and best performance. Navigation was kept as simple as possible to let the content be the star. Iterative testing and updating of newsletters, sign-up forms, and social tactics kept response rates and conversions growing month over month. How I Fight MS has won eleven awards to date, including a Webby in the category of Online Film & Video Reality - a rst for a pharmaceutical brand.
28
@jaysonelliot
29
www.HowIFightMS.com
The passive consumer is a thing of the past. Attention used to go to the brand that could shout the loudest. Today, its the brand that can create the most engaging and authentic experience. User Experience is the discipline of user-centered and behavioral design.
30
My approach to UX
Strategy
User Experience
Creative
Technology
Account
31 A framework for creating great user experiences

jayson.elliot@gmail.com @jaysonelliot All projects begin with a group session, where every discipline has an opportunity to look at the problem together. Disciplines take time to break off and work separately, then come together repeatedly to collaborate at key moments.
l a me nne sis rvie gn n fra ws ly s re ha t si ic e i a e g c so lua de atio ios is me wir l o qu / c an r int ch g tin spe ne s a a e y r s r y r e e r v a in fr ly m p re re delit tion ty te nal ist tic e titiv olde sea ana pato a cr cena nal i te d x e e n i n io sys io ma ck w h- viga abili it e uris mp akeh er r ct st a c rtic so ser s nct f d r o n g o te Au He Co St Us Tra Pa Pe U Fu Ec Si Bl Hi Na Us Fu Te lut ion
ion
ws
k or w
o sh
p s nt ap m es m n tio s
Discover
Dene
Design
Develop
Deploy
32
A framework for creating great user experience

Process sounds oppressive, prescriptive, unyielding. Lets call it a framework. The steps you see here are tools to be used if and when appropriate. No two projects are the same.
Examples
The following pages show some examples of work Ive created, organized along the framework you just saw.
33
34
Heuristics are just a ve-dollar word for rules of thumb. The evaluation is a systematic inspection, based on recognized usability principles. The goal is to identify problems in the site so that they can be prioritized and addressed in the design. @jaysonelliot
Heuristic evaluation
35
Heuristics are just a ve-dollar word for rules of thumb. The evaluation is a systematic inspection, based on recognized usability principles. The goal is to identify problems in the site so that they can be prioritized and addressed in the design. @jaysonelliot
Heuristic evaluation
36
Scorecards are a great way to communicate complex competitive sets. A digital scorecard should involve every relevant discipline, not just User Experience.
Competitive Analysis
37
Focus groups arent enough. To build a compelling and intuitive experience, you need observational methods that reveal what people are unable to tell you themselves.
User Research
38
When creating a large or complex taxonomy, card sorting is a tried and true method for learning how people categorize content. Listening to people debate among themselves is sometimes the most valuable part of the session. @jaysonelliot
Card Sorting
39
In this usability test for Jaguar, we asked participants to describe the brand in a few words, both before and after using the site. The video shows how words like sleek, high-end, and sexy were replaced by disconnected and impractical after using Jaguar.com. @jaysonelliot
Usability Testing
40
In this one-day workshop, the client, Lilly Pharmaceuticals, participated in creating eight rich personas and fty-ve user scenarios for their Cialis web site. The output of this workshop became the foundation of all UX and design work for the rest of the project. Designers kept photos of the personas at their desks, and referred to them by name. @jaysonelliot
Participatory workshops
41
Personas are a way to humanize the user, and allow the designer to empathize with the person theyre designing for. While theyre based on research about real-world users, theyre not market segments. A good persona is a tool, not a crutch. @jaysonelliot
Personas
42
Personas are a way to humanize the user, and allow the designer to empathize with the person theyre designing for. While theyre based on research about real-world users, theyre not market segments. A good persona is a tool, not a crutch. @jaysonelliot
Personas
43
User scenarios can take many forms, from detailed step-bystep storyboards to cartoon sketches, or even videos. The important thing is that user scenarios provide an opportunity for all involved to envision the site or product in use by real people. The things we describe happening lead to the functional requirements in the next stage. @jaysonelliot
User Scenarios
44
User Scenarios
45
User Scenarios
46
User Scenarios
47
Unlike their equivalent documents from technical disciplines, the UX ecosystems are primarily user-focused, and are used to make sure we understand all the pieces of the experience, and can account for the information architecture in each one.
Ecosystem / Channel map

48
Unlike their equivalent documents from technical disciplines, the UX ecosystems are primarily user-focused, and are used to make sure we understand all the pieces of the experience, and can account for the information architecture in each one.
Ecosystem / Channel map

49
Site maps show the structure of a web site on a page-bypage level. They serve as the blueprint for the site, as designers and developers check off the pages throughout the build. While they display hierarchy and relationships, site maps do not show every link from page to page. @jaysonelliot
Site Map
50
Site maps show the structure of a web site on a page-bypage level. They serve as the blueprint for the site, as designers and developers check off the pages throughout the build. While they display hierarchy and relationships, site maps do not show every link from page to page. @jaysonelliot
Site Map
51
In the early stages of information architecture (IA), block wireframes identify the elements of a page without venturing into interaction design or the placement of individual elements. They give visual designers and UX architects a common starting point for collaboration. @jaysonelliot
Block wireframes
52
In the early stages of information architecture (IA), block wireframes identify the elements of a page without venturing into interaction design or the placement of individual elements. They give visual designers and UX architects a common starting point for collaboration. @jaysonelliot
Block wireframes
53
These wireframes are the documentation most people think of when they hear the phrase information architecture. The wireframes are for many audiences, from the client to the developers to the visual designers. @jaysonelliot
High-delity wireframes
54
55
56
57
58
59
60
61
62
A swimlane chart is a great way to see how different systems and actors interact in a nal product. Swimlanes are a valuable visualization tool for use case modeling.
Swimlane ows
63
Navigational ows are used primarily by developers and QA. They show the actions triggered by every clickable and interactive object on a page. A side benet of navigational ows is that they force the IA to examine every step carefully, catching the inevitable oversights that can come from wireframes alone. @jaysonelliot
Navigational ows
Thank You
Additional samples and videos are available by request. Lets talk.
64
@jaysonelliot

Jayson Elliot Portfolio

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Jayson Elliot Portfolio

Uploaded by

Copyright:

Available Formats

Jayson Elliot

User Experience Director

Jayson who now what now?

Heres whats in this document

Brands Ive worked on

A selection of brands from 1995-present

Case Study: Preferio

Case Study: Humira

Case Study: Wizards of the Coast

Wizards of the Coast

Case Study: Campbells Soup

Case Study: Land Rover

Case Study: Sunovion

Case Study: Nationwide

Case Study: EMD Serono

31 A framework for creating great user experiences

A framework for creating great user experience

Ecosystem / Channel map

Ecosystem / Channel map

You might also like