Jub yam, Redesign web application

Jub yam, Redesign web application

Jub yam, Redesign web application

UX and UI design

UX and UI design

Timeline

Timeline

2 Months (Nov 2023 - Dec 2023)

2 Months (Nov 2023 - Dec 2023)

Table of contents

Title

Overview

I am responsible for redesigning web applications also designing landing pages and dashboards for Jub-yam, The Chinese astrology calendar web application. Scope of work includes researching, wireframe, hi-fi, design systems, and pinching with clients.

Design thinking process

In this project, the double-diamond framework is used to guide the understanding of design problems and define solutions.

Discover phase

In the discovery stage, I have desk research about competitor analysis, social insight, and UI usage for best practices.

Competitor analysis

My competitor analysis is based on direct competitors and indirect competitors.

Direct competitors

The direct competitor is Num Eiang. Num Eiang has a high market share in the Chinese Astro calendar application market. So I decided to analyze feature and their user target, As I hypothesize that Jamyam will likely have the same user target.

Indirect competitors

In part of indirect competitors analysis. I decided to look on the horoscope astrology oracle app. My expectation is observation to feature inside the app that might be able to be implemented in my project.

User research

In this stage, clients give me their user demographic in current use and I have to do desk research observe off-site, and analyze to create a lean persona also make assumptions and hypotheses to be able to focus point of work scope.


Define phase

After research and observation were done. I have defined, assumption, hypnosis, lean persona, and key features in my project.

Assumption

Users like to check the time when it has good fortune energy each day to make informed decisions about important things.

Hypothesis

if we design the fortune timeline to be more prominent and simplify content, we expect an increase more DAU (Daily active user).


Lean persona

During the define user persona phase, the client provided detailed information about the current user base, which primarily consists of individuals from the Baby Boomer and Gen-X generations. However, the client is also aiming to attract new users following the redesign. Drawing on insights from this observation and faced with a tight deadline for delivering the design to a developer, I opted to develop a lean persona in place of a user persona. This decision was made to streamline the process and expedite the design creation.

Require Feature

Astrology Calendar
Weekly Oracle
Monthly oracle
Yearly oracle


Chines zodiac information
User astrology information, the subscription plan, Invite friends, and wallet

Develop phase

Develop stage is created from the define phase by aligning features, lean persona, hypothesis, and assumption. In development stage has included a site map, user flow, web application wireframe, web application UI, landing page, and dashboard for the client.

Site map

A site map is created by focusing on the features in the list.

User flow

User flow creates to visual scenario when the user is using this app.

This User flow does not include a none-premium user scenario

This User flow only includes flow when the premium day is an expired scenario

Wireframe

UI design

Design system

The design system is made to support web applications, landing pages, and dashboards. The design system will also make for scalable apps in the future.

Landing page design

The landing page is built from a no-code development tool and hosted by Webflow.

Dashboard

Dashboard application management for clients

Deliver phase

After designing all processes delivering the design to the developer and doing some guerrilla usability testing with the team and close people Jub-yam is finally launched.


Reflection

I’m proud to work on such a large-scale project from the very beginning. Thanks a lot to my team for believing in me and supporting me throughout the process. I learned to collaborate with engineers and hand off final deliverables.

Overview

I am responsible for redesigning web applications also designing landing pages and dashboards for Jub-yam, The Chinese astrology calendar web application. Scope of work includes researching, wireframe, hi-fi, design systems, and pinching with clients.

Design thinking process

In this project, the double-diamond framework is used to guide the understanding of design problems and define solutions.

Discover phase

In the discovery stage, I have desk research about competitor analysis, social insight, and UI usage for best practices.

Competitor analysis

My competitor analysis is based on direct competitors and indirect competitors.

Direct competitors

The direct competitor is Num Eiang. Num Eiang has a high market share in the Chinese Astro calendar application market. So I decided to analyze feature and their user target, As I hypothesize that Jamyam will likely have the same user target.

Indirect competitors

In part of indirect competitors analysis. I decided to look on the horoscope astrology oracle app. My expectation is observation to feature inside the app that might be able to be implemented in my project.

User research

In this stage, clients give me their user demographic in current use and I have to do desk research observe off-site, and analyze to create a lean persona also make assumptions and hypotheses to be able to focus point of work scope.


Define phase

After research and observation were done. I have defined, assumption, hypnosis, lean persona, and key features in my project.

Assumption

Users like to check the time when it has good fortune energy each day to make informed decisions about important things.

Hypothesis

if we design the fortune timeline to be more prominent and simplify content, we expect an increase more DAU (Daily active user).


Lean persona

During the define user persona phase, the client provided detailed information about the current user base, which primarily consists of individuals from the Baby Boomer and Gen-X generations. However, the client is also aiming to attract new users following the redesign. Drawing on insights from this observation and faced with a tight deadline for delivering the design to a developer, I opted to develop a lean persona in place of a user persona. This decision was made to streamline the process and expedite the design creation.

Require Feature

Astrology Calendar
Weekly Oracle
Monthly oracle
Yearly oracle


Chines zodiac information
User astrology information, the subscription plan, Invite friends, and wallet

Develop phase

Develop stage is created from the define phase by aligning features, lean persona, hypothesis, and assumption. In development stage has included a site map, user flow, web application wireframe, web application UI, landing page, and dashboard for the client.

Site map

A site map is created by focusing on the features in the list.

User flow

User flow creates to visual scenario when the user is using this app.

This User flow does not include a none-premium user scenario

This User flow only includes flow when the premium day is an expired scenario

Wireframe

UI design

Design system

The design system is made to support web applications, landing pages, and dashboards. The design system will also make for scalable apps in the future.

Landing page design

The landing page is built from a no-code development tool and hosted by Webflow.

Dashboard

Dashboard application management for clients

Deliver phase

After designing all processes delivering the design to the developer and doing some guerrilla usability testing with the team and close people Jub-yam is finally launched.


Reflection

I’m proud to work on such a large-scale project from the very beginning. Thanks a lot to my team for believing in me and supporting me throughout the process. I learned to collaborate with engineers and hand off final deliverables.

Contact