This month, we shared our latest case study with Sora Schools which involved a new brand identity and website following their $2.7M raise. Our goal was to create a brand that appeals to both the students and parents that Sora Schools serves whilst looking credible, innovative, and unique. Here is a closer look at their website, where we explore the key features, tactics, and UX/UI best practices enlisted to make it a possibility. The brand redesign showcased the concept of “thinking outside of the box” by using dynamic and freely positioned graphics. Doodles and spontaneous gestures were visual nods to project-based learning and a way to celebrate student discovery. The custom elements bring dynamism and light-heartedness to the identity while highlighting that Sora is first and foremost a people-based business. We brought this concept through to the website by using design elements creatively without disrupting and overwhelming the user. Wavy graphic separators We incorporated multiple colors and elements into the website without being overwhelming or distracting by using wavy graphics to break up sections on the page. This creates a more balanced visual experience for users. Dropdown menus One of the main challenges we faced when designing the website was organizing the large amount of information that needed to be displayed. To ensure this content was communicated to the user effectively we decided to use dropdown menus. This allows for relevant information to be revealed when needed and hidden when not, and reduces the need for endless scrolling, improving user experience on the website. Distinctive hierarchy with font and color Due to the size of the website, it was essential for the navigation and flow throughout the website to be seamless. We employed a typographical hierarchy to relay clear distinctions content and to make reading significantly easier.
CTAs To promote familiarity and ease of browsing on the website, we accompanied relevant sections and CTAs with illustrative icons. We also kept consistency with all buttons and CTAs throughout the website with a set theme of rounded buttons and arrows.
Micro Animations Finally, as an added touch, we added animation to the website’s main call to action. This subtle animation added personality and empathy to the site and further integrated the brand mission into the website.