Project: Improve Commonlounge's HomePage User Experience

Overview

In this project, you’ll be working with the Commonlounge team again to help us improve the UX of home page at https://www.commonlounge.com

This is what it currently looks like:

Commonlounge Home Page (May 2018)

Problem

As the number of courses offered on Commonlounge has been steadily increasing every month, the team has noticed that the users have to scroll a lot to get to the sections that they are actually interested in. In some cases, users walk away with the impression that the platform is all about Machine Learning or Computer Programming courses — without realizing that the breadth of topics is much greater than just that! (There are courses from UX Design & Product Management to Personal Finance!).

Solution

Having a search and filter functionality on top of the page seems like a good idea. But the team isn’t sure and needs your creative input in both discovering current problems with the page through user interviews, as well as coming up with solutions to solve them.

Device & Platform

The solutions you come up with should work on Desktop Web.

Hints and ideas

If you’re feeling stuck, you can take a peek at few ideas from the team:

How about a search box on top of the page that lets the user enter a keyword like “Web Dev”? How would that work? Would it filter the thumbnails below? How would you clearly communicate that the search results are being shown?

Would it be helpful to onboard the user when they land on this page by asking them questions about what they are interested in, and how familiar they are with that topic — and then recommending them a 1-3 courses that best fit their needs?

How about a Filter next to Search that lets the user filter courses by criteria like Level (Beginner, Medium, Advanced), or whether the course has Quizzes and Projects, and on any other criteria you think may be useful for the user.

Deliverables

1. User Research: Find 3 users who are close to the personas you created in the last project. Run a usability test on them to uncover problems with the home page. Summarize your findings in terms of what worked and what didn’t work.
2. Solutions proposed: For things that didn’t work and for things where you see room for improvement, propose solutions that you think will help improve the team.
3. Flow Diagrams: If necessary, create Flow Diagrams for any solutions that involve multiple states/steps.
4. Wireframes: Draw out wireframes on paper for your proposed solution. Go back to the users you talked to in Step 1 and
5. Prototypes (Optional): Mock a hifi prototype of your wireframe in a tool like Sketch, Figma or Adobe XD.

How to upload your deliverables?

Hit the Reply button below and create a post with the 5 Deliverables. I will give feedback on every submission. In addition, please feel free to critique other submissions — there’s a lot of room to learn from each other.