Overview
HBCU Hub is a mobile application that connects students, recruiters, and coaches within the Historically Black Colleges and Universities (HBCU) community. The app aims to simplify the user interface (UI), gamify the onboarding process, and enhance the overall user experience. The client's goal is to create a dynamic and interactive platform that embodies the essence of HBCU culture while integrating new features such as video calling, live chat, and a backend for HBCU staff and coaches.
Client Goals
1. Simplify the UI and create a clean and seamless user experience.
2. Gamify the onboarding process to enhance user engagement.
3. Integrate college recruiters and provide them with backend access on the app.
4. Represent HBCU culture through the app's design and aesthetics.
Challenges and Pain Points
Users find the initial sign-up process cumbersome, requiring them to input all their information upfront. The goal is to break down the onboarding process into steps for a smoother user experience.
The app lacks dynamic content, leading to a repetitive user experience.
The client desires a UI that embodies HBCU culture and stands out from other college-related apps.
ADA compliance is essential, ensuring font colors, sizes, and background colors are accessible for users with visual impairments. Consideration for gender and parental access is also important.
Previous App Design
Target Audience
Students: Seeking to send academic information to HBCU staff, filter schools based on interest, and save preferred schools.
Recruiters: Wanting to view booked appointments with students, contact students via the app, and potentially post ads in the future.
Coaches: Interested in seeing booked appointments with students, contacting students through the app, and potentially utilizing in-app advertising in the future.
Design Considerations
The existing logo will remain unchanged, but feedback is welcome regarding the use of a diamond shape for the H background.
Brand guidelines and content library will remain consistent with the current representation of the brand.
Design should align with the top graphic design trends for Gen-Z, including colorful minimalism, geometric shapes, simple data visualization, monochrome effects, text-heavy videos, symbols, muted colors, and social slide decks.
Popular social apps such as GroupMe, Discord, and Instagram can serve as references for the overall design approach.
User Story
UX Design Process
Research and Analysis
Conducted a thorough analysis of the client's requirements and existing pain points.
Explored the target audience's needs, motivations, and expectations.
Researched the top graphic design trends for Gen-Z and popular social apps to inform the design direction.
Top Graphic Design Trends in 2021-2022 for Gen-Z:
Colorful minimalism
Geometric shapes
Simple data visualization
Monochrome effects
Text-heavy videos
Symbols, symbols, symbols
Muted colors
Most popular social apps
GroupMe
Discord
Instagram
Wireframing and Prototyping
Wireframes were created to visualize the new UI, focusing on simplifying the interface, introducing dynamic content, and incorporating gamification elements.
Prototypes to test and refine the user flow and interactions was done via Marvelapp.com
Iterative Design
Collaborated with the client and development team to gather feedback and iterate on the design.
Conducted ADA testing to ensure accessibility compliance, considering font colors, sizes, background colors, and inclusive design elements.
Incorporated user feedback and made iterative design improvements based on the stakeholder's preferences.
Visual Design
Defined a color palette and shapes that align with HBCU culture, considering the client's desire for colorful minimalism and muted colors.
Created profile page designs that showcase the user's academic information, preferred schools, and appointments.
Designed icons and visual elements for social features, focusing on symbols and geometric shapes.
Conclusion
The redesign of the HBCU Hub mobile app aimed to enhance the user experience, simplify the UI, and integrate new features to facilitate seamless communication between students, recruiters, and coaches.
By incorporating dynamic content, gamification elements, and adhering to the established brand guidelines, the new design successfully represents the vibrant HBCU culture. The ADA compliance testing ensures inclusivity for all users, while the use of current design trends and inspiration from popular social apps caters to the target audience's preferences. The iterative design process, collaboration with stakeholders, and incorporation of user feedback ensured a successful outcome for the HBCU Hub app redesign.
%20(1).png)
Prototyping
Prototyping was done via Invision
Error Handling
We also addressed error handling through scrum meetings with developers and shareholder requests to make sure we addressed current issues that affect the ETF screener, which could bleed over into the Stock Screener.
.png)
