GrowthSchool - UI Design

Workshop Challenge / UI Redesign

GrowthSchool is an online education platform known for its diverse range of courses in entrepreneurship, marketing, and personal development.

Time 2 weeks

Role User Interface Designer

Team 1

Design Challenge

The primary goal was to enhance user experience on Growth School's All courses - page, improving aesthetics, navigation, and functionality. Prioritize user preferences, resolve issues, integrate content with a new colour scheme, and harmonize logo colours.

Demographic Information

I discovered that their target audience ranges from 25 to 45 years old. This diverse group includes working professionals, entrepreneurs, and individuals seeking career growth and skill development.

User Persona

Taking into account insights gathered from interviews of 3-4 users, a persona was crafted.

Key Findings.

  1. User Decision-Making Insights:

    Users heavily rely on reviews and ratings from other users to guide their course selections effectively.

  2. Challenges in Planning:

    Users expressed a need for clearer visibility of course durations to better plan their learning schedules.

  3. Desire for Information:

    Users seek expanded course descriptions that provide comprehensive insights into course content, objectives, and expected outcomes.

  4. Detailed Course Overview:

    Users value access to detailed previews of course syllabi, offering a breakdown of topics, modules, and learning objectives to aid in decision-making.

  5. Inspirational Content:

    Success stories shared by past participants were noted as inspiring and crucial in helping users envision the real-world impacts and achievements.

  6. Instructor Transparency:

    Users emphasized the importance of detailed instructor information to establish trust and confidence in the credibility of the courses.

Style Guide

I decided to include a vibrant and diverse colour palette in the style guide, featuring colours such as hot pink, azure blue, and deep purple. These colours were selected to evoke energy, creativity, and a sense of uniqueness, reflecting the dynamic and diverse nature of the brand I'm working on.

I have implemented a typography system that emphasizes readability and consistency. Choosing Poppins as the primary typeface has allowed me to establish a harmonious and visually appealing style across various elements.

I took a hands-on approach by designing a fresh set of UI elements. This included creating new buttons, icons, and input fields.

When I initiated the design, I set up a responsive grid system: 24 columns with a 32-pixel spacing for web and 12 columns with a 20-pixel spacing for mobile to ensure a consistent layout across different devices.

Key Features

 User Reviews and Ratings:

Prominently featured user reviews and ratings for each course enable users to gauge quality and relevance, aiding informed decisions.

 Comprehensive Course Information:

Course descriptions have been expanded to provide in-depth insights into the course content, objectives, and outcomes. Users can now gain a thorough understanding of what each course entails.

Course Duration:

Course duration is now clearly displayed, allowing users to plan their learning schedules more effectively.

Course Syllabus Preview:

Users can access a preview of the course syllabus, giving them a detailed breakdown of topics, modules, and learning objectives.

 Instructor Details:

Users can access detailed information about the course instructors, including their qualifications, expertise, and background. This adds credibility to the courses and helps users assess the instructor's suitability.

Success Stories:

To inspire and motivate users, we have included success stories related to each course. These stories highlight the real-world impact and achievements of previous course participants.

Frequently Asked Questions (FAQs):

We have added a dedicated section for FAQs related to each course. This addresses common queries and provides users with quick answers to their questions.

Simplified Layout:

I have streamlined the course listing layout to make it more intuitive and user-friendly. Users can now easily access the information they need without unnecessary distractions.

Ihave designed a sample UI for the responsive mobile version of the website page.

Mock-Ups