UX Design: Website and mobile app

UX Design: Website and mobile app

UX Design: Website and mobile app

UX Design: Website and mobile app

UX Design: Website and mobile app

Project Overview: At Home Solutions (AHS), a NYC-based care services provider, asked our UX team to redesign their website and create a mobile app, so that the company's digital presence can be up to date which will help to grow their customer base.

Problem Statement: AHS website looks outdated and functions inoperable. The company wants to attract new customers with a better digital presence - better company image and effective professional information. The challenge was how we might redesign their website and a mobile app that portrait professionalism and trustworthiness of AHS's services.

Project Overview: At Home Solutions (AHS), a NYC-based care services provider, asked our UX team to redesign their website and create a mobile app, so that the company's digital presence can be up to date which will help to grow their customer base. My role of the project is a UX researcher and designer in the team of four. 

Problem Statement: The company's current website looks outdated and functions inoperable. They want to attract new customers with a better digital presence. How might we redesign their website and create a mobile app that portrait professionalism and trustworthiness of their services?

Client: At Home Solution (AHS)
Role: UX Researcher & Designer
Period: 2 Weeks
Team: Four UX Researchers & Designers
Software: Sketch, inVision, Adobe Photoshop.

Design Process & Highlights

Design Process & Highlights

  • Stakeholder Interview
  • Content Audit & Heuristic Analysis on existing website
  • Problem Space Research
  • Comparative & Competitive analysis
  • User Interview
  • Affinity Mapping
  • Persona
  • User Journey Map
  • Navigation Study
  • Create UI Design Style Guide
  • Ideate & Create Wireframes
  • Create Prototypes for Both Mobile App & Website
  • Usability Testing & Report
  • Iterate and Improve Prototypes
  • Annotate User Flow & Wireframes
AHS AppWebsiteLaptop1

Affinity Mapping

Affinity Mapping

After User Interview, we studied the notes and came out with insights. We then worked together using Affinity Mapping method to synthesis our research data and summarize the important discoveries. This helps our design decision for a clean concise website that conveys the key information that the target users look for when browsing a home-care service website.

After User Interview and study the notes, every team member came out with insights and then worked together using Affinity Mapping method to synthesis our research and come out insights. This helps our design decision for a clean concise site that conveys the key information for the users' easy navigation.

affnitymapping1

Persona

Persona

The target audience is defined based on our stakeholder interview and user research. By creating this Persona who’s in her 50s and struggling with challenges including her financial situation and energy level, taking care of her family and her father who needs home care service. The Persona helped establishing a clear vision about whom the website would speak to. It also helped us to design for the best user readability and accessibility.

P5 Persona

User Journey Map

User Journey Map

By studying the journey a user looking for home-care service, we created User Journey Map to see users' painpoints and to zoom in the opportunity spot where AHS site should put focus on.

JourseyMap

Navigation Study

Navigation Study

As part of the Spec Doc, I did Navigation Study to explain to the stakeholders and the developer how our design decisions were made and how the users will navigate the site and app, from page to page, screen to screen, and find what they're looking for.

AHS app Navigations Study
AHS Desktop Navigations Study-1

Ideate . Create Wireframes . Prototypes

Ideate. Create Wireframes & Prototypes

Ideate. Create Wireframes & Prototype

Through Design Studio, our design team sit together and quickly ideated about the features we want to include in the mobile app and website. We hand sketched the navigation screens and pages' layouts. Then used Sketch app to create wireframes. We brought the wireframes to inVision app to create prototypes for usability testing. We did a few rounds of iteration of design and testing to create the hi-fi website and mobile app. 

3wireframes

The prototype of the mobile app can be viewed here - https://rachelwangdesign.com/wp-content/uploads/2019/07/AHSApp.mp4
The prototype of the desktop website can be viewed here - https://rachelwangdesign.com/wp-content/uploads/2019/07/AHSwebsitehifiprototype.mp4

linkedinW50
instagram-icon-grey4
pinterestW50

 RACHELMONK7@GMAIL.COM

 rachel.luohan@gmail.com

 rachel.luohan@gmail.com

 rachel.luohan@gmail.com