UX Portfolio
0 likes273 views
The document provides an overview of the Primerica mobile app for insurance agents. It includes introductory screens that explain the onboarding and qualification process in 3 steps: 1) importing contacts, 2) qualifying contacts based on criteria, and 3) setting appointments with high-scoring contacts. Screenshots illustrate each step and the app's main menu, news feeds, tools, and support features to help agents connect with clients and their team.
UX Portfolio
- 1. Who What Wow A proven User Experience Lead who can deliver exceptional solutions on time, every time.
- 2. 2 Methodologies Over five years of experience in Agile, & a decade in Waterfall. Backlog Scrum Planning Retrospective Dev Review Next Whether preparing detailed design specifications and functional requirements or rapidly generating ideas for a story wall—whatever the process—I can assure that the ideas are communicated clearly & effectively. #Adaptable
- 3. 3 Hills Explore Evaluate Sponsor User Understand Playbacks Prototype IBM Design Thinking Paradigms In the midst of the biggest paradigm shift in 50 years. As a life-long learner, I’m fascinated by the shifting world of design and following the leaders closely. I’ve been to workshops at IBM’s world headquarters for design in Aus- tin and follow Google Ventures weekly. #Learner Google Ventures Design Sprint Understand Diverge PrototypeDefine Decide Validate
- 4. 4 For the Women We Love Wireframes Version 1.0 published October 24, 2012 by Brian Marczak (brian@elevatorinteractive.com) 4 11of Home Page as viewed by Persona B FIND ANSWERS GET SUPPORT TAKE ACTION MAKE CONNECTIONS WHO WE ARE DONATE NOW If you have been recently diagnosed with cancer, lorem ipsum dolor sit amet consectetur adipiscing elit. START HERE UPCOMING EVENTS FIND ANSWERS Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum accumsan consequat felis eget ullamcorper mauris id facilisis nisi. Learn More TAKE ACTION Aliquam posuere vehicula tellus id consequat. Aenean eros risus, sollicitudin quis ultrices id, varius eget quam. Praesent eget massa erat, in malesuada enim. Learn More GET SUPPORT Aliquam erat volutpat. Duis eget est et sapien lobor tis varius. Aenean rutrum odio sed lorem auctor quis malesuada dolor molestie. Learn More RECENT EVENTS B User Research Contextual inquiry, user interviews, persona development & experience mapping. As an independent consultant, I helped For the Women We Love, an Atlanta-based women’s cancer support center, develop perso- nas which were used to build an understanding of the needs of their clients. The personas were used to design and develop their content strategy, website, and outreach collateral. THE NEWLY DIAGNOSED Jenny Reed I don’t even know where to begin — I just need answers. I need to know what to expect. Level of Experience Knowledge of Cancer Extent of Support Network Frequency of Interaction Frame of Mind Jenny has just been diagnosed. She is frightened and extremely anxious — possibly even frantic — and she may feel emotionally numb. Goals Feeling overwhelmed, Jenny may find it hard to formulate questions or even know which questions to ask. When she can, she may ask some of the following: • What is my diagnosis? Where can I learn more about my disease? • What are my treatment options? • What is the survivability of the disease? • How might the various forms of treatment affect me? • How do I find the best treatment? • Who can I talk to who will understand what I’m going through? Jenny needs to know what to expect. She may also be looking for confirmation of her experience thus far. Measuring Success A successful interaction may result when Jenny: • Makes contact by phone • Makes contact via email • Opts in to a mailing list (a newsletter or an upcoming event) • Downloads a PDF • Attends an event ” User Persona A Level of Experience Knowledge of Cancer Extent of Support Network Frequency of Interaction THE PATIENT IN TREATMENT Karen Butler I need help, I just don’t know if there’s anyone who can help me. Frame of Mind While she appears stoic, it is apparent that Karen is exceedingly worried and wants to regain a feeling of control. Goals Karen wants to know how she can be actively involved in her own treat- ment. She’s seeking information regarding: • Types of treatment • Efficacy of prescribed treatment • Side effects • Integrative or complimentary therapies • Clinical trials • Second opinions Generally, Karen needs resources for a variety of issues that will affect her life during treatment. She may be seeking assistance with: • Work-related issues • Financial issues • Transportation • Integrative or complimentary therapies • Nutrition and excercise Measuring Success A successful interaction may result when Karen: • Makes contact by phone • Makes contact via email • Requests financial help • Opts in to a mailing list (a newsletter or an upcoming event) • Downloads or prints a PDF • Attends an event • Makes a donation ” User Persona B Level of Experience Knowledge of Cancer Extent of Support Network Frequency of Interaction THE SURVIVOR Suzie Mullane I want to connect with others who have faced the same challenges that I have. ” User Persona C Frame of Mind Suzie is happy, but she still experiences moments of fear and isolation much like those she experienced during treatment. It is clear that she ben- efited from the interaction involved in treatment and that she now, at times, feels lonely. Further, she may experience what is commonly referred to as “survivor’s guilt” and may show signs of trauma. Suzie may be ready to reach out to others and listen to the stories of other patients and survivors. Goals Depending on whether her medical team has addressed survivor issues, Suzie may have questions about what to expect after her treatment: • What comes next? What about follow-up visits? • How do I prevent a recurrence? What should I look for? • How can I tell what is a “normal” post-treatment sensation versus something to be concerned about? • What are the signs of trauma? Will I recover physically and emotionally? • What is “normal” now? to recover emotionally and regain confidence, Suzie needs to share with others. She may want to give back in some way or #Empathy For the Women We Love Website as Viewed by Persona B
- 5. 5 TaaS Transcoding Profile Creation Wo Version 4 published March 27, 2009 by Brian Marczak (brian@mul The Transcoding Profile Creation Workflow Create Egress Sub-profile Create Egress Sub-profile Does Source Egress Sub-profile Exist? Does Metadata Egress Sub-profile Exist? Create Ingress Sub-profile Upload Watermark Create Metadata Sub-profile Create Signaling Sub-profile Create Signaling Sub-profile Create Output Sub-profile Create Egress Sub-profile New Transcoding Profile Save Does Ingress Sub-profile Exist? Does Watermark Exist? Does Metadata Sub-profile Exist? Does Signaling Sub-profile Exist? Does Error Signaling Sub-profile Exist? Does Output Sub-profile Exist? Does Egress Sub-profile Exist? 1 2 3 The r quick Conc to ed Solution The tran guide a the com flow. On And as y task, ma Clearly ti the app flow and rate. In files in a Concepting Concept flows serve as a fast and easy way to present ideas for stakeholder validation. As I’ve been using Adobe products for over 15 years, Photoshop, Illustrator, and InDesign are second-nature to me, so while I’ve tested other products like Axure and OmniGraffle, concepting and wireframing in Adobe is much faster. And, with the seamless integration between products, delivering pixel-perfect wireframes makes the rest of the team much faster too. #Ideation
- 6. 6 Primerica App Walkthrough AT&T 95%12:00 PM -1:120:01Done Getting Started Video Get started by following these three steps: 1) Import a list of your best contacts 2) Qualify them (which gives them a score) 3) Set Appointments with contacts scoring 4 & 5 Your Field Trainer: David Turley (770) 555-5448 tturley@callaltanta.com Watch the video to learn more: Get startedSkip Getting Started Onboarding Intro*O1 First time thru? Yes Yes Yes No No No Use the STEAM method to remind you of names: Salesperson Teacher Enthusiastic Ambitious Most Competitive Friends, family, neighbors, sports buddies – don’t leave anyone out! Step 1: Import Contacts Select contactsSkip Step 1 Instructions*O2 Watch Continue? Continue? Video: Getting StartedGSV Sign In Need help? Rep ID Password Message Twitter Primerica Calendar Facebook Google Settings Photos Contacts Phone Mail MusicSafari Monday Tap the Menu icon in the top left corner to reveal the navigation menu. Home App Intro 1*I1.1 Connect with your team instantly via Spark, where you can chat with your team, share photos, video & audio, all in one place. What’s News 1*N1.1 Use the menu to view company news, check your status & standings, access tools, and get help. Home Tools Financial Calculators Mobile FNA Quick Quote App Intro 2*I1.2 Got questions? Use the new Support Center to find answers about sales tools, applications and more! ? What’s News 2*N1.2 The Search icon offers easy access to marketing tools & training videos, as well as speeches, stories and more. Home App Intro 3*I1.3 The Utilities icon provides access to Preferences and functions such as Print and Email. Mobile FNA App Intro 3*I1.3 The Notifications icon alerts you to items that need your attention. Done Home App Intro 3*I1.3 Now you can access Auto & Home directly from the Tools section of the main menu. Done Home Tools Auto & Home Financial Calculators Mobile FNA What’s News 3*N1.3 Now it’s time to qualify your contacts. You’ll choose which options apply to each contact: Home Owner Employed Age 25-55 Married Children If nothing applies, choose ‘None.’ Step 2: Qualify Contacts Qualify contactsSkip Set appointmentsSkip Now, you’ll work with your Field Trainer to set appoint- ments. In the following list, your contacts are ranked by their Qualified Score. Tap a name for phone numbers. Tap the calendar icon to set an appointment. Your Field Trainer: David Turley (770) 555-5448 tturley@callaltanta.com Step 3: Set Appointments Import Dalton Abrams m Adams Lauren Holden Lindsey Johnson Michael Jordan Carrie Lloyd Jerry Lowe Herbert Moog Import Contacts*O3 Dalton Abrams m Adams Credibility Rating Credibility Rating Favorite HomeOwner Employed Age25-55 Married Children None Save Qualifications Dalton Abrams m Adams Lauren Holden Lindsey Johnson Michael Jordan Carrie Lloyd Jerry Lowe Herbert Moog 5 5 5 5 5 5 4 4 + + + + + + + + Done 12 Appointments Scheduled Keeping your pipeline full with qualified contacts and appointments is the best way to grow your business! Great Start! Finish 10+ Step 2 Instructions*O4 Batch Qualify*O5 Step 3 Instructions*O6 Set Appointments*O7 Completion*O8 Continue? Continue? AT&T 95%12:00 PM Home HomeH Any new features? Authentication*A SYSTEM New Rep? Scenario G The user launches the Primerica App on POL. Upon signing in, an optional on-boarding process begins for new reps, while existing reps are presented with general information about navigating the app. Usability Testing A quick-and-dirty usability test enables us to validate whether people will be able to use the product as intended. When I began prototyping, there weren’t any tools. I hand coded everything myself in ActionScript. Now, a variety of tools make getting prototypes into the hands of stakeholders and sponsor users faster than ever. I’ve tested Axure, Pixate, Proto.io, UXPin, et al., but currently my preferred tool is InVision. http://invis.io/DM27NCEQC #Strategic
- 7. 7 Mobile Registration Workflow Account Primerica Online Registration 95%12:00 PMAT&T You must complete registration for each role that you hold. Which role would you like to register at this time? Continue It looks like we have more than one record on file A rep in Abbey Greene’s base shop Abbey Greene’s office staff RVP Antonia Sullivan RVP Antonia Sullivan’s office staff I have a specfic solution number IBA Lookup Account Setup Service Level Payment Info Which Solution Number would you like to register? Account Primerica Online Registration 95%12:00 PMAT&T What’s your date of birth? And your SSN/SIN? Don’t worry—your information will be transferred through a private, secured connection. If you run into any problems, you can get help by tapping the icon or by calling the Primerica Help Center at 1-888-737-2255. Search Welcome IBA Lookup Account Setup Service Level Payment Info Let’s start by looking up your IBA Account Primerica Online Registration 95%12:00 PMAT&T Terms of Use I Agree One more thing... IBA Lookup Account Setup Service Level Payment Info View PDF Blandam vellorum latatas pelluptas mo dictem undaercia duciae esto eum lamidus aut eaquundit, vel et enitatem quasinc tibearumetus enimust, officaecte sum quis dem et aut odionec tatio. Perovidita nonseque volorpos et quam fugitaque con necepe ommodis sum sedi dignihil incipis autemqui ut et que ne quo desto bla elenihit. Faceat ates aut ligenet as entium la miliquo eatium harum facepel essinum ilibus estis ressi optae. Nam necus prent utatesti dolupid IBA LookupR1 AgreementR4 Account Primerica Online Registration 95%12:00 PMAT&T You must complete registration for each role that you hold. Which role would you like to register at this time? Continue It looks like we have more than one record on file A rep in Abbey Greene’s base shop Abbey Greene’s office staff RVP Antonia Sullivan RVP Antonia Sullivan’s office staff I have a specfic solution number IBA Lookup Account Setup Service Level Payment Info Account Primerica Online Registration 95%12:00 PMAT&T No problem, a representative at at the Primerica Help Center can clear this right up. IBA Lookup Account Setup Service Level Payment Info Call 1-888-737-2255 Account Primerica Online Registration 95%12:00 PMAT&T Please verify the following information. That’s correctThere’s a typo Great, let’s setup your account IBA Lookup Account Setup Service Level Payment Info Solution Number Name Title RVP Home address Not Assigned Robin Zaragamba Associate Antonia Sullivan 12398 Winona Drive, Broomfield, CO 80020 Account Primerica Online Registration 95%12:00 PMAT&T Please choose a service level IBA Lookup Account Setup Service Level Payment Info Primerica Online ID Primerica Email Virtual Base Shop Home Office Bulletins Personal Information Compliance Information Training & Development Primerica Playbook PFN TV Millionaires In Training Production Leaders Business Essentials TurboApps FNA, Quick Quote, and more Primerica Online IDs for your team Primerica Email for your team Your own personal Primerica website FULL SERVICE $99 PRIMERICA ONLINE $49 LIMITED SERVICE NO COST Select Take advantage of Primerica Online’s amazing training and development! Duplicate RecordsR1B IBA ErrorR2B VerificationR2 Service LevelR5 Account Primerica Online Registration 95%12:00 PMAT&T Next Choose a username & password IBA Lookup Account Setup Service Level Payment Info Username Password Strength And provide your answer Choose a secret question for password recovery Account Primerica Online Registration 95%12:00 PMAT&T How would you like to pay? IBA Lookup Account Setup Service Level Payment Info Pay by credit card Mail a check or money order Next Account Primerica Online Registration 95%12:00 PMAT&T Credit Card Info Billing Address IBA Lookup Account Setup Service Level Payment Info Confirm Order Name on card Card number Street address Street address Security code City Country Expiration date State ZIP code Account Primerica Online Registration 95%12:00 PMAT&T IBA Lookup Account Setup Service Level Payment Info Submit Payment Your Visa card will be charged $99.00 for Full Service access. Name on card Card number Security code Expiration date Billing address Robin Zaragamba 4568 6832 5455 5782 247 08/15 12398 Winona Drive, Broomfield, CO 80020 Account Primerica Online Registration 95%12:00 PMAT&T Congratulations! Your account setup is complete. Continue to Login Your Solution Number is WIN15 Your Primerica email address is robin.zaragamba@primerica.com Account Primerica Online Registration 95%12:00 PMAT&T IBA Lookup Account Setup Service Level Payment Info Please send your payment of $49.00 to the address below: Primerica Financial Services 1 Primerica Parkway Duluth, GA 30099 Make your check or money order payable to Primerica Financial Services and include your solution number in the memo. Your service level will be limited until your check or money order is received and processed at the Home Office. Next Account SetupR3 Payment MethodR6 Credit Card InfoR7B Payment ConfirmationR7C CompletionR8Pay by MailR7A No Yes Duplicate Records? Scenario A The user downloads the Primerica App, installs it and launches it, then follows a registration link on the Authentication page to the workflow below to complete the registration process. User System Usability Testing High-fidelity prototypes enable us to validate the emotional impact created by the experience. Towards the end of a project, more refined prototypes are in order. These provide confidence in the process and enable stakeholders to preview new features. http://invis.io/DY25DL5BN
- 8. 8 Team Stream Appendix B Matthew Thorpe DEC 31, 2014 Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet. 3 Yasmin Fleming JAN 2 Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum. 3 Spencer Ellis Yesterday Message three, eu commodo an elementum quis. YF MT SE Team Stream 95%12:00 PMAT&T Stream View Base Team Stream Font Styles font-family: ‘Open Sans’, sans-serif; font-weight: 400; font-size: 16px; App Header background: #666; color: #fff; Author Initials font-size: 18px; background: #999; color: #fff; Dividing Line background: #d9d9d9; Online Status Indicator (See Team Stream Sprites) Offline Status Indicator (See Team Stream Sprites) Author Name font-weight: 600; color: #666; Date color: #999; Message Body line-height: 20px; color: #000; Like Button (.PRIcons_thumbs-up) color: #999; Like Button Active (.PRIcons_thumbs-up) color: #0c76d7; Likes Count color: #999; Compose Button (.PRIcons_pencil) background: #0c76d7; color: #fff; width: 56px; height: 56px; Delete Button font-size: 18px; color: #fff; background: #a00000; background: -webkit-linear-gradient(top,#a00000 0%,#cc0000 4%,#ef0000 25%); width: 120px; height: 100%; //120px if height exceeds 160px E F G K J D A B C D E F G H I J K L I B C A H Stream Styles Style Specifications Yasmin Fleming JAN 2 Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum. 3 Delete Matthew Thorpe DEC 31, 2014 Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet. 3 Spencer Ellis Yesterday Message three, eu commodo an elementum quis. MT SE Team Stream 95%12:00 PMAT&T Delete Button L Team Stream Appendix A Smartphone Metrics Matthew Thorpe DEC 31, 2014 Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet. 3 Yasmin Fleming JAN 2 Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum. 3 Spencer Ellis Yesterday Message three, eu commodo an elementum quis. YF MT SE Team Stream 95% 12:00 PM AT&T 10 10 auto 10 18px 16 28px 32px Matthew Thorpe DEC 31, 2014 Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet. 3 Yasmin Fleming JAN 2 Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum. 3 Spencer Ellis Yesterday Message three, eu commodo an elementum quis. YF MT SE Team Stream 95% 12:00 PM AT&T 11px 11px 16px 22px 11px 32px 16px 56px 28px Stream View, Horizontal Spacing Stream View, Vertical Spacing Metrics Yasmin Fleming JAN 2 Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum. 3 Delete Matthew Thorpe DEC 31, 2014 Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet. 3 Spencer Ellis Yesterday Message three, eu commodo an elementum quis. MT SE Team Stream 95% 12:00 PM AT&T 120px 100% of container height unless container height exceeds 160px, then height should be 120px Delete Button Requirements Work Sample Detailed functional specifications #Focused When working with a larger team, functional specifications ensure no detail is left in question.
- 9. 9 With built-in source control, we chose a simple MediaWiki to host our styleguide and design resources which enables the entire design team to contribute to the effort. Styleguides Work Sample Living styleguides & custom icon fonts
- 10. 10 We use Density-independent pixel sprite sheets to accelerate load times and future-proof our applications for screens up to 4K. Styleguides Work Sample Future-proofing /images/sprite.png /images/iphone/sprite@2x.png /images/iphone/sprite@3x.png /images/iphone/sprite@4x.png /images/android/res-ldpi/sprite.png /images/android/res-mdpi/sprite.png /images/android/res-hdpi/sprite.png /images/android/res-xhdpi/sprite.png /images/android/res-xxhdpi/sprite.png /images/android/res-xxxhdpi/sprite.png @1x @4x
- 11. 11 For Primerica Now, we used cards to group together information in an intui- tive way, enabling the user to easily scan through a lot of content and pinpoint the information most relevant to them. Delivery Work Sample Primerica Now
- 12. 12 Delivery Work Sample Primerica Reports For Primerica’s reports, we tool inspiration from Google Material and used thumb- based navigation for standard-sized smartphones to enable users to navigate through the app using only one hand. #Restorative
- 13. How might we reduce complexity foster understanding eliminate uncertainty promote innovation improve efficiency create value ? Collaboration IDEO HMW Every problem is an opportunity for design. By framing our challenge as a How Might We question, we’ll set ourselves up for innovative solutions.