Rising Star
A mobile-first platform in beta phase that provides easy access to information for Black youth to expose them to a career in tech
BlackMINT's mission is to mentor Black youth. To provide them with practical skills, career advice, and the help they need to become confident, career-focused, and aspiring leaders in technology. The organization's goal is to have Black professionals to make up more than 5% of the tech workforce in Canada by 2030. One of their initiatives is building a digital product called Rising Star.
Rising Star is a new web based app created by BlackMINT that focuses on providing information and resources to Black high school students so they have the guidance to pursue a career in tech. Rising Star is currently in the beta phase with plans to launch in Winter 2021. I designed the first iteration of Rising Star that was shipped for BlackMINT’s first event as well as securing funding from investors.
Our Design Sprint was focused on creating certain tasks for each week as it allowed the developers to continue improving the frontend and backend of the first version while I was in charge of iterating the new features.
Sprint 0: Brainstorming and preparation
Sprint 1: Landing page
Sprint 2: Dashboard
Sprint 3: Improved UI Design
Sprint 4: Preparation to ship & results
UX Designer: Lori Chai
Product Manager: Ayobami A.
Developers: Ibrahim A., Justin L.
Tools
Figma, Jira
Timeline
Oct-Nov 2020 | 8 weeks | Remote
Rising Star did not make an impact on the users even though they saw the value in using the app.
The user testing for the first version was generally well received however, there were common themes that were mentioned and we wanted to address them for the first iteration.
01-“I wish the Rising Star name was more prominent because I want to feel more like one when I use the site.”
02- “The app looks nice but the white background looks kind of plain. Maybe make it more colorful.”
03- “I want to know what the points are. What am I getting the points for?”
Our team spent a week defining the sprint’s goals that would drive the beta version of the product. The questions we asked were based on the user testing feedback that guided our design decisions for the Sprint.
How can we make Rising Star’s tasks more interesting so users do not see it as “part of their homework”?
How can we communicate the
importance of the point system so users will feel motivated in using the tools in the platform?
What type of visual style do teenagers like so they can have a great user experience?
A landing page was decided by the PM and myself for the following reasons:
01– There was no information that explains what the product has to offer and its benefits
02–There was no unique selling proposition to prompt new users in signing up
03– Landing page is the first impression of the platform. It needs to be engaging and attractive to entice new users to sign up
Since this was my first time designing for a unique demographic, I researched the current market trends and best practices when designing for teenagers. These findings helped me to shape Rising Star’s visual identity and copy writing. Source: NM Group
My vision for the point dashboard was to show cumulative progression, the different levels to achieve, and an indicator of the current level. Having Question 1 of the sprint in mind, I designed the point system to be informative to users to complete their learning goals.
After getting the feedback from the PM, I made the dashboard’s point system as minimal as possible and left the diagram to explain the user’s progression. We wanted to emphasize the points diagram and having the copywriting to explain the diagram was unnecessary.
This was a feature that I implemented and told the PM about my concern that I didn’t understand the reason why users needed to watch videos or read the mentors bios. There was no explanation on how these tasks would help the user’s career journey. Based on the Principles of Disclosure Theory in Information Architecture, I suggested having different icons being used as prompts. When they’re tapped they reveal more information about the tasks. And thus, 2 new features were born.
The drop down button reveals more information to the users to see their progress and the the different tasks they could do in gaining more points. When a user finishes a task, it gets checked and when they complete the progress bar, the user will earn the points.
This would answer the “why” for completing certain tasks. I added “i” icons for each of the resources to explain the significance and benefits of completing a task in the user’s career journey.
My vision for the logo was to follow BlackMINT’s style but still have a unique identity for Rising Star. The logo needed to look like the product was still related to BlackMINT.
The most popular feedback for Rising Star was about its visual design. With having Question 3 in mind of our sprint, I improved the user interface for the careers section as these resources were the most text heavy. Since the information was necessary as part of the user’s learning, I made these two sections more engaging with icons, and illustrations, and emphasized the sub-headings.
Due to budget constraints, we were unable to frequently do user testing for the demographic. As an early stage startup, we do not have the resources for online consumer insights and due to the COVID-19 pandemic, it was difficult to recruit teenagers at a local school for guerilla testing.
Our team shipped the beta version to BlackMINT’s first event (Tech Stardom Series) where over 30 high school students attended. We presented a demo and encouraged the students to sign up for the platform. Rising Star gained a lot of attraction and the initial impressions were very positive.
After shipping the product to BlackMINT's first event, my designs resulted in recruiting more users for the platform and securing funding from investors! The funding will help provide us with resources to continue adding new features of the web app.
If you want to collaborate or talk about design, please feel free to reach out to me :)
