Overview

About ChatFusion

WorkFlowGenius is a ChatGPT prompt template library that contains different prompts, like crafting email and generating ideas. Prompts are categorized into different occupations in hope of increasing work efficiency for different users.

*As this is a co-brand of ChatFusion, they shared the same style guide and design.

My Role

As the only designer in this project, I owned and led design strategy for the entire project from 0 - 1 — from discussing the idea with stakeholders to executing the design. My focus is to design an easy-to-use user interface and experience for WorkFlow Genius. My job includes gathering requirements, creating design solutions, and ensuring an intuitive and efficient flow.
‍

Background

Since ChatGPT first came out, it has had a significant impact on work life, transforming how people approach tasks, collaborate, and manage their time. But still, there are some problems that users encounter when using it. I created an online survey to get more insights to what users are thinking when using ChatGPT, to see if they face any difficulties and what they think could benefit them.
‍

Insights

• Users find typing long instructions to be the most challenging aspect of using ChatGPT. They were not sure if entering this instruction will give them what they're looking for.
• Strong preference for sample keyword templates that they can simply follow and fill in.

Solution

To solve the problem and to provide an even better version of ChatGPT, our team decided to create a prompt template library that provides all sorts of different use cases templates, categorized by different occupations. The templates will allow users to input simple keywords to generate their desired results, ultimately improving efficiency at work.
‍

User Flow

This is an example of the user flow for a use case where a HR is looking to create an email content to introduce a new work-from-home policy to the company.

Wireframing (Before: Full page workflow)

I created a lo-fi wireframe that showcase the overall flow and did a quick and easy usability test within the team to test it out. The team liked the overall flow of the product but finds entering a full page workflow a little too engaging as it takes more effort to go back to the dashboard if they were to find other workflows.

Wireframing Iteration (After: Workflow in module)

With that in mind, I iterate the wireframe, instead of entering a full screen workflow, a module will pop up to run the workflow. This method would provide more flexibility as users can do a quick run and exit to move on to other workflows.
We also added a "See Demo" button to give users the option of testing the template with just one click before investing the time to use it.

Design Outcome

Other Exploration

Dashboard Design

I explored many different designs to display the workflows on the workflows, how to display and how much information to place. After much consideration, I decided to go with card-based layout as it is the most versatile and also comes with great responsiveness. I also place icons to represent the occupation it is under for quicker recognition. Throughout the process, I also added the option to toggle to change card mode to list mode for flexible user experience.

Sidebar Menu

In the sidebar menu, apart from quick access to the occupations, favorite workflows, we also wanted to place "Recent Workflows" into the sidebar for users to access their recent history. During the wireframing process, I explored two grouping methods, one with everything listed out on the sidebar, another that expands out a submenu to view the workflows.

After much consideration, I decided to go with listing the items on a single sidebar, grouping the items effectively by categorizing them into "Workflows", "Personas" and "Recent Activities", also adding a top menu bar for quick access to the "Personas" The team really liked the sidebar menu as the classification makes a lot of sense and the small titles provide clear labeling to the users.
‍

WorkflowGenius: Designing A ChatGPT prompt template library