29
Ben Dedrick and Michael Iseri Student Project. General Assembly UXDi. Winter 2013. Prepared for: SaveUp January 22, 2014

Student Project Presentation for SaveUp

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: Student Project Presentation for SaveUp

Ben Dedrick and Michael Iseri Student Project. General Assembly UXDi. Winter 2013. Prepared for: SaveUp January 22, 2014

Page 2: Student Project Presentation for SaveUp

about the site SaveUp is a website and mobile application for users who want a fun, easy, and rewarding way to meet their financial goals. It interfaces with nearly all major banks, credit unions, retirement funds, and other financial services to monitor users’ spending and saving habits, and rewards them for making smart financial decisions. Unlike Mint or other finance tracking services, SaveUp encourages users to overcome their debt or save for the future by offering high-value prize drawings to users who make consistent steps toward their goals. !

about the project SaveUp is a startup based in San Francisco, CA. This project was assigned as part of General Assembly’s UX Design Immersive class; the assigned objective was to increase SaveUp’s user acquisition and retention by examining and redesigning the onboarding process. !This project focuses on the Web implementation of SaveUp.

Page 3: Student Project Presentation for SaveUp

design principlesChange company perception Help users see SaveUp as caring, helpful, trustworthy, and fun. !Emphasize what’s different Make sure users can immediately see why SaveUp is worth checking out. !Offer clear value proposition This strategy for encouraging savings has been used before, and it worked. People really do win prizes from the site; ensure users know this. !Show how it works Use clear visual language and simple copy text to help users understand the process. !Encourage trust from users Endorsements from major publications, partnerships with banks and credit unions, believable testimonials from real users, and exciting visual design all give users a stronger sense that SaveUp is a site they can trust.

Page 4: Student Project Presentation for SaveUp

user arrives at Home Page

Explores Home Page to learn more about

SaveUpjoin

Tour Page

Tour page 2

browse prizes

Register Account Page

Browse, invite, or register

join

connect

connectaccount registration page

invite

invite

invite

sign up page Dashboard

join

continue

User receives email

original site flow

Page 5: Student Project Presentation for SaveUp

original site flow

Page 6: Student Project Presentation for SaveUp

new site flow

User arrives at Home page

Explores Homepage to

learn more about SaveUp

Joins site Sign up pageUser receives

emailJoin Confirm DashboardJoins site

Page 7: Student Project Presentation for SaveUp

new site flow

Page 8: Student Project Presentation for SaveUp

personas

Alexa Bortoncan Photographer’s Assistant 24 years – Santa Fe, New Mexico !Technical Comfort: Below Average for Gen-Y !Back Story • Lots of student loan debt; no savings; some credit card debt • Not much leftover from paycheck to put towards savings • No long-term or retirement savings !Motivations • Concerned about ending up broke, open to trying something new • Heard about SaveUp from a friend !Frustrations • Fears falling for scam. Getting suspicious since she hasn’t won anything • Not getting much advice that is relevant to her situation !Ideal Experience • Feels like she’s making progress towards paying off credit card debt • Opens a savings account with SaveUp’s help • Gets to play more often / earns more credits for her hard work

Julie Holt-Ramirez School Nurse 32 years – Texas !Technical Comfort: Average for Gen-X !Back Story • Got married after graduating from Texas A&M, has 2 kids • Loves her job and helping people • Worried about paying kids’ college tuition, and retirement • Loves couponing, shoe shopping, and “getting a deal!” !Motivations • Read about SaveUp in parents magazine • Wants to save and be more organized • Loves the prizes and chances to win on SaveUp !Frustrations • Has trouble connecting accounts (forgot passwords or husband has them) • Finds the games boring / repetitive • Wants to be more organized, but she can’t get her husband to look at SaveUp “because it’s a game” !Ideal Experience • More coupons and discounts • More games / less repetition • More financial visualizations that she can show her husband • Still really loves SaveUp

Page 9: Student Project Presentation for SaveUp

original site review

This image looks nice, but misses a valuable opportunity to communicate branding or functionality to the user in an exciting way.

Great endorsements to have. However, skeptical users may not glean much from the icons alone. A quote from one of these publications would go a long way.

Page 10: Student Project Presentation for SaveUp

original site review

This information is useful, but users tended to be confused about the function of the graphics. Adding some interactivity and polish to this part of the page will encourage users to pay attention to it, and improve their perception of the site.

Page 11: Student Project Presentation for SaveUp

original site review

The fact that SaveUp genuinely wants their users to learn about savings and finance says a lot about the company. Improving the messaging of SaveUp’s core values will help users feel more confident about signing up.

There are a lot of really positive reviews and testimonials about the product, but we’re only given two of them up front. !Also, the role of research and the application of PLS in other countries are great ways to help people understand SaveUp’s foundation, but they’re only lightly touched on at the bottom of the front page.

Page 12: Student Project Presentation for SaveUp

original site review

Including a steady flow of recent winners is a great idea, and we want it to be visible. Giving this the appearance of a live feed may help alert potential new users that there are real people out there who are actually winning prizes through SaveUp.

The “How it works” page is full of great information, but it’s difficult to find. Feedback from users indicated that they wondered why more of this info wasn’t on the front page, and most of them had to be directed to the link to see it.

Page 13: Student Project Presentation for SaveUp

original site review

These icons look nice, but the fact that they’re non-functional makes this page confusing to users, since it doesn’t ultimately serve a purpose.

The most important button on this page is tucked away in the corner. We want this to be a major call to action!

Page 14: Student Project Presentation for SaveUp

original site review

This process is an extremely important part of getting started with SaveUp, but each step of it removes the user from the onboarding flow and throws them into the “wilderness” of the main site. We want this process to introduce users to the functions of the site in a way that reinforces the value proposition from the front page, while also encouraging them to complete their registration by adding and authenticating their financial accounts.

Page 15: Student Project Presentation for SaveUp

Example: Uber Huge, eye-catching splash image with carousel to keep the site feeling “alive.” !Establishes brand while also communicating functionality/ value proposition. !Content below the fold is also interactive and makes the site exciting to read.

Improve visual fidelity to promote user confidence.

Page 16: Student Project Presentation for SaveUp

Example: Fitbit Again, big splash establishes branding while also telling the user about what they’re seeing. More information appears automatically (carousel) without requiring the user to navigate away to other pages or read large blocks of text.

Improve visual fidelity to promote user confidence.

Page 17: Student Project Presentation for SaveUp

proposed solution 1

Increase visibility of value proposition.

Method !Make sure that a clear presentation of the site’s features greets users as soon as they arrive. !Maintain a clear call to action on the main page. !Reinforce the features throughout the onboarding process. !

Page 18: Student Project Presentation for SaveUp

Example: Simple Value proposition is clearly stated from the front page, and call to action is the first thing the user sees.

Increase visibility of value proposition.

Page 19: Student Project Presentation for SaveUp

Method !Display more specific endorsements from trusted publications as they become available. !Mention partnerships with banks, credit unions, and other institutions. !Explain SaveUp’s basis in PLS research to prove that the concept works.

Example: Mint

proposed solution 2

Refine language and content to improve user trust.

Page 20: Student Project Presentation for SaveUp

Method !Add interactivity and more dynamic content panels to the front page. !Refine visual styling.

proposed solution 3

Improve visual fidelity to promote user confidence.

Page 21: Student Project Presentation for SaveUp

research and ideation

Method !Interview workers from SaveUp to find out how they wanted the company to be perceived. !Findings !The company should be helpful and fun, but also seen as secure and safe. Users should get the feeling that they are here to help them for their own good. !Opportunities !Redesigning of the front page could take care of the company perception at a first glance. Imagery, wording, information hierarchy and architecture could do a lot for this.

Page 22: Student Project Presentation for SaveUp

early concepts

Page 23: Student Project Presentation for SaveUp

early concepts

Method !Sketch different iterations of the homepage to find optimal ways to present important information.

!

Findings !Some information didn’t seem to sit well with other bits of information (i.e. dashboard preview with testimonials or bank eligibility). Some information could also be presented very well in splash images. Hover capabilities can be very engaging.

Page 24: Student Project Presentation for SaveUp

early concepts

1. Decided to make the prizes at the top of the screen a filter for which games-types you can play. Now acts as more of a filter.

1

Page 25: Student Project Presentation for SaveUp

annotated concepts

1

1

2

3

4

1. Paralax scrolling makes the site more engaging. !2. Eligibility check is easily accessible on the front page, so new users won’t

have to search too much or be forced to sign up before they can see if their bank works with SaveUp. “Check eligibility” button changes to a signup button if the bank is eligible. !

3. Testimonials and big name endorsements encourage trust. !4. Sign up button located at the bottom of the page so people wont have to

scroll all the way back up the page to reach a sign up button.

Page 26: Student Project Presentation for SaveUp

annotated concepts

1. Included progress bars at the tops of pages to make new users aware of where they are in certain processes. This includes the username creation process, the overall account completion, and the link bank account process.

!2. Added “carrots” and indications that people would earn extra credits for linking bank accounts as another incentive to complete the linking process.

1 2

Page 27: Student Project Presentation for SaveUp

annotated concepts

1. Placed challenges in the top right because it can provide incentives to save. !

2. Shortened the social/recent winners window because it didn’t need so much space to serve its purpose of informing users that there are real winners. Moved the rewards to a less visible place (bottom right) because they didn't seem to be a major part of the site. !

3. Added the account detail snapshot. !4. Blacked out or blocked certain functionalities to encourage

new users to link accounts.

1 2

3

4

4

Page 28: Student Project Presentation for SaveUp

prototype