LashPRO Academy is the education arm of Sugarlash PRO, an internationally-recognized eyelash extension brand.
Their award-winning courses and certification programs boast a reach of 18,000+ students across 90 countries around the world.
After successfully designing and building their new Shopify website, Sugarlash PRO came back to our team with another challenge — to redefine the frontend of their online academy with new UX / UI that better aligned with their main e-commerce channel.
They understood that the two halves of their brand now felt disjointed, and wanted us to carry over the same digital facelift we had implemented for Shopify just half a year ago. It was also a timely opportunity to retool the LashPRO Academy website based on operational pivots brought on by the global pandemic. What was previously a combination of in-person and online training was now 100% remote, making it all the more important to refresh outdated features and properly address known user pain points.
Having prior familiarity with the client and their line of business allowed us to work faster, ideate with greater contextual accuracy and ensure proper design continuity. We collaborated closely with the developers behind the current website to ensure that our proposed solutions — which included an entirely new library of components and modules — could be supported within the existing OpenCart framework.
Initial onboarding involved roleplaying our primary persona, the lash artistry student.
We learned about the fundamental aspects of the academy’s curriculum, such as how examinations are graded in order to achieve certification, and what add-ons (e.g. practice kits, webinars, etc.) are offered to further enrich the learning experience. But we also learned that poor content strategy across the website made it needlessly tough for users to both find and comprehend all of this valuable information. It wasn’t uncommon for a student to enrol in a course that exceeded their present skill sets, thanks to misleading UX copywriting (or lack thereof).
The primary objective became clear once we sorted through all of the known user pain points. We needed to optimize the website for product discovery and education, allowing students to fully understand each of LashPRO Academy’s course offerings, and self-identify their best fit(s).
Since our scope of work was to overhaul the buying journey up until the end of Checkout, the PLPs and PDPs naturally became the main focus of our design efforts. Courses, practice kits and webinars were upgraded with their own unique templates, giving the client more freedom to tailor and display the right content for each type of product.
The Homepage was reshaped into a more captivating elevator pitch, and a guide page was added to help break down all course options into different recommended levels of proficiency.
Using our preexisting design system from Sugarlash PRO’s Shopify website as a foundation, we ideated several new elements that could accommodate large amounts of copy while still remaining usable and responsive-friendly.
One notable example is the side drawer we introduced to PDPs, allowing users to conveniently review lengthy lists (e.g. lesson lists for courses, equipment lists for practice kits, etc.) without losing their spot on the page.
We anticipated that PDPs would run long, so we decided on a fixed “Add to Cart” bar for easier access once the user is ready to commit to purchase. Certain details within the bar also change, depending on which type of product the user is viewing. (For example, courses have variant options to choose from, while webinars do not.)
Other key areas of the website — such as About Us, FAQ and pretty much the entire Account Dashboard — received much-needed makeovers for improved content flow, usability and consistency with the brand’s overall aesthetic.