

CrossWork App
UX Design I UI Design
Overview
A powerful B2B tool to connect individual contributors with mentors for CrossWork learning opportunities within an organization.
City museum Chicago app is a case study project designing for employees to connect with mentors for CrossWork learning opportunities within the same organization. The user research was done by a team of 5 students, and UX/UI design was done by myself. I continued developing the ideas and turned it to a prototype.
My Role
UX Research (Team)
App Concept & Prototyping (sole)
Toolkit
Photoshop, Illustrator & Figma
The Challenges
One design challenge may be a lack of understanding of the information from the employers’ aspect. Researching and analyzing information from employers’ perspectives is difficult due to this being a self-directed case study project.
Time
Summer , 2020. (10Weeks)
Winter, 2023. (10 Weeks)
Problem
Employers may also be seeking opportunities to effectively manage employee burnout, increase productivity levels, gain collaboration, and improve employee connectivity without the availability of in-person communication. Ultimately, during a time of mass change in workplace environments, employers must assess how to sustain employee satisfaction. Our research study focused on the ability of CrossWork learning opportunities to meet these goals.
Solution
Proposed Solution: Design a B2B Product that provides users CrossWork learning opportunities: refer to time spent with a coworker from another role or department or time completing work using a different competency for the following purpose:
-
Improve performance in current role.
-
Increase ability to move to another role.
-
Increase proficiency related to current skills.
-
Increase the breadth of your skillset.
-
Develop employees’ understanding of another role.
Design Process

-
User Research. Discover Audience
-
Competitive Analysis: Learning
-
User personas: Finding the users' need
-
User journey map: finding design opportunities
-
User Flow: Understand the path taken by a prototypical user on a website or app to complete a task
-
Prototype: Ongoing
Research Findings
To conduct qualitative Research & quantitative Research insights, research methods include interviews, surveys, and field observations.

Additional User Research
Apart from what I already know from previous user research, I have done additional field observations to understand what organizations are currently offering to their employees. One participant is a Lead Research scientist from St Jude Children's Research Hospital, one is a university faculty at the University of Tennessee and the last participant is my program manager who I work within the same organization. I observed each participant for 1 hour during their workday.

Competitive Analysis
I did a Competitive Analysis to learn what products are in the market that helps employees to communicate, mark calendars, or schedule meetings. I looked into Microsoft Teams, Slack, Google Chars, and Outlook. This chart shows that these applications all have chat, calendar, and contact review features. Such communication features are important to be included when I design the CrossWork app. I originally thought adding a review rating feature might be helpful to allow individual contributors to learn more about the leaders. However, after I reviewed this chat and had discussions with my mentor and collaborators, I decided to exclude the rating feature to protect leaders’ privacy and avoid organizations' confidential issues.

Personas
I created 2 user personas based on qualitative research insights. The primary persona is Alicia Smith who is a 22-year-old lady who works as a receptionist in a corporate office. The secondary is Kevin Peete who is a 30-year-old gentleman who works as a salesman in a B2B organization.


Journey Map
The User Journey Map is created based on the primary persona Alicia Smith. Alicia speaks for most of my target users with the challenge aspect. This framework helped me to understand potential users empathically and pin their pain points and opportunities where I can implement design features to provide an experience that solves their problems.
.png)
User Flow
Mapping out a user flow allowed the team to visualize the experience that a typical user would be engaging in as they clicked through our app. This helped us decide on what app screens we’d need to start crafting.low fidelity wireframes (include sketches). All of the team members contributed to this key design process step. The checkpoint in our design path helped us move from discussion to the drawing board.

Wireframes (Progressing, will add later)

* PLACE HOLDER IMAGE
Moodboard
Below is the mood board and color palette. I was inspired by these images, and I choose these colors for the app design. I wanted the app interface design to give users the feeling of being bold, professional, sharing, and knowledgeable.

Prototyping


Final Design
Final Mockups

Next Steps
The prototyping is not fully completed. There are many missing components that I haven’t yet executed due to time constraints. Additionally, I need to work on the interactive aspects to make the testing experience more engaging and the testing experience more realistic. Here are the potential steps that I plan to keep working on:
-
Continue developing high-fidelity prototypes.
-
Facilitate focus groups to review prototypes.
-
A/B testing to evaluate the pros and cons of different interfaces with sample user groups.
-
Provide HR and manager metrics on user data that they could use to help suggest opportunities to employees for development.