How do you elevate
an online learning platform to the next level?
High Fidelity Mockups
Sketch | Illustrator | Photoshop
The Back Story
01 - What is Elevate?
Elevate is an online learning platform that teaches front-end development and focuses on bridging the gap between students and experienced mentors. This platform would focus on strengthening the relationship between student and mentor and make learning more engaging.
I worked as the user interface designer and worked in close collaboration with a team of other designers. I was responsible for working with the UX designer and taking their research findings and wireframes and conceptualize the platform's brand identity and design high-fidelity mockups.
02 - The online learning
Through our research as well as interviewing people who have used online learning, we found that users are not gaining the necessary set of skills and knowledge to apply what they've learned to real-life situations. After creating a comprehensive SWOT analysis, some of the insight we discovered was that users need comprehensive lessons and projects available in one platform and feedback from professionals in those industries. From these findings, my team sought to create a platform that allows students to recieve feedback on their work and give users real-world assignments that they can apply elsewhere.
03 - Developing the visual direction
The biggest challenge we faced during the visual design development was articulating what Elevate offers as a learning platform in a way that resonates with core users. We defined the brands mission by explaining what Elevate is and how it's able to benefit the user. Our visual approach was focused on making content easily digestable and acessable without sacrificing sophistication and visual integrity. Looking at other online learning platforms, such as codecademy, as inspiration, I focused on creating a light and open environment that made consumption of information easier.
With Elevate, I wanted to showcase exactly what the word "elevate" stood for. From a bold color scheme, to introducing uplifting and motivating photography, our direction was focused on creating an online learning platform that felt personable, playful, and most important fun. Because what's the purpose of learning if it isn't engaging the user?
After creating a competitive analysis on different online learning platforms, I made a moodboard consisting of those site in order to gather inspiration. One of the sites that helped define the overall brand was Codecademy because of the minimalistic style, how simple it was to view your progress in a course, and how intuitive the coding workspace is.
Final Style Tile
After mood boarding, I created various style tiles with distinct aesthetics which resulted in the final style tile. The final style consists of elements from previous iterations.
The Web Platform
04 - New and Improved
Thanks for scrolling this far
Take a look at my next project!