UX/UI Design Intern Project

Type

Project Overview

Web-based dashboard

(Responsive)

Designed the co-branding platform for admin and clients to connect and provide benefits and assist clients throughout the home purchase, sale, and refinance process

Team

My Contributions

Worked with

1 Project Manager

2 Engineers

2 Business/ Marketing

In this project, I handled UX/UI design solo and work with the project manager and 2 engineers, and the business and marketing team. As a UX/UI designer, I redefined the information architecture & user flow, brought up discussions within the team, created interactive prototypes to articulate design decisions, and iterate the design.

Date

Objectives & Goals

July 2022 - Dec 2022

5 months

This product provide benefits and educational materials related to the processes surrounding home ownership and financial offered to clients

Final Design Mockup

We launched this with MVP features (client flow) first to satisfy the early customers to get feedback for future updates.

This design was to demonstrate the new version of the existing product.

1️⃣ Discover 2️⃣ Define 3️⃣ Ideate 4️⃣ Design

1️⃣ Discover

A kickoff meeting

Me and product manager had a kickoff meeting in the beginning. Product managers explained the project, and we discussed and determined the target users and what problems were, why we need the features, how to solve the issues, the details of where we needed to focus, long-term goals, potential user journeys, and what journeys we should be prioritizing for the project.

Old Design

The company has an existing product that was previously only accessible to internal employees, and the product's information was primarily distributed through PDFs without a dedicated website.

2️⃣ Define

Objective & Goals

The primary goal of this project is to create a dashboard that enables administrators to easily customize and manage accounts while providing customers with the ability to view their service and benefits information.

Additionally, customers will have a direct line of communication with the service team for support and assistance.

Target Users

Admin

Enable administrators to customize and manage client information and benefit details.

Clients

"Access detailed information about each service and benefit, as well as educational resources related to the processes involved in home ownership."

3️⃣ Ideate

Task Flow

Based on my research and collaboration with the team, I created a task flow for both administrators and clients to streamline their tasks and clearly defined how users interact with the website's functionality.

Clients Flow

Design Ideation and Sketching ideas

To find the optimal solution, I began by exploring various options. As there are two types of users - clients and administrators - I sketched out different ideas and potential flows for each perspective. I then organized a meeting to present rough wireframes and collaborate with the team to select the best idea and iterate on the concept.

Admin Flow

Lo-fi Wireframes

4️⃣ Design

Hi-Fi wireframes / Final design mockups

After getting stakeholder feedback to determine the design direction, I started to put it into the high-fidelity design mockup and prototypes.

*Please feel free to reach out for more details on the design

Co-branding Logo Research&Design

Since this project is to collaborate with other companies, I researched the criteria for representing the co-brand logo were, and then designed the co-brand logo using the example company logo.

Co-branding Logo Research

Co-branding Logo Design Experiment

Design System

I document the dashboard design system. Whenever I had new UI elements, I added the new UI specs into the document (See A below). Also, I created the merchant customizable email template and the external co-branding logo design final version guidelines (See B below).

(A) Design System

(B) Co-Branding Guidlines

💭 What I learned

I led this project as UX/UI designer and I deeply learned about the development life cycle. It helped me collaborate with engineers easier.
Even a demo product, I need to share with not only the PM but also engineers at the early stage. Once the demo design was approved by stakeholders, Some functions were significant changes to engineers. It would impact an engineer's entire sprints.
Since this project was focused on MVP, the next step would be to focus on the usability test. Throughout the usability test, it’s important to gather insights and improve the user experience. Also, it’s the early stage now so there’s might need updates once we get more clients to manage them.