Shkolo Website
Shkolo
UX/UI
Shkolo - a place where students, teachers and parents meet
Category
Share:
Shkolo - UX / UI Project
Project Phases
Designing Shkolo, we followed a structured process. We began with research, analyzing the educational platform landscape, creating user personas, and studying competitors. Then, we mapped user flows and created low-fidelity wireframes to shape the platform's structure. High-fidelity prototypes were developed for realistic user experiences, and usability testing guided refinements. We also established a UI styleguide for consistency and a library of reusable components for a cohesive, responsive design. This approach ensured Shkolo's user-centered and visually appealing design.
01
Research
Understand the educational platform landscape, create user personas, and analyze competitors to gather insights.
02
User Flow & Wireframes
Define information architecture, map user flows, and create low-fidelity wireframes to plan the platform’s structure and functionality.
03
Prototype
Develop high-fidelity prototypes with interactivity to simulate the user experience and gather feedback.
04
UI Styleguide Kit
Create a UI styleguide for design consistency and a library of reusable components for a cohesive and responsive design.
Navigation Architecture
Creating user flow and navigation architecture is crucial to ensure a seamless and intuitive user experience, helping users effortlessly find what they need and achieve their goals within a digital platform.
Wireframes
Throughout the wireframing process, we experimented with various approaches, styles, images, and illustrations. This iterative exploration played a crucial role in clarifying our goals and ultimately helped us identify the most effective and compelling design direction for Shkolo.
Typography
We chose the Apparat font for the design due to its modern aesthetic and the inclusion of Cyrillic extensions. This decision was driven by the need to accommodate a diverse user base, including those who use Cyrillic scripts, ensuring a visually cohesive and inclusive user experience across various languages and alphabets while maintaining a contemporary design style.
Colours
In our color palette, each user group has its unique color code for quick identification and a personalized experience. Students have warm green, teachers use purple, administrators adopt calming blue, and parents connect with friendly orange. This fosters a sense of belonging and enhances user engagement.
Blue (Principle)
#6090FF
Purple (Teacher)
#AD65AE
Green (Pupil)
#2DA387
Yellow (Parent)
#FEB918
Landing Page
The Shkolo landing page is a user-friendly gateway that introduces visitors to the educational platform, enticing them to explore its unique features and benefits.
Banners
At Shkolo, the colorful and enticing call-to-action banners are designed to captivate user's attention. These visually appealing elements are an invitation to explore the platform and unlock exciting experiences.
Pricing Page
Shkolo's pricing page offers a seamless user experience with a slider that instantly adjusts the price based on the number of students you choose, ensuring transparency and customization.
Additional Pages
Discover the Shkolo experience beyond the homepage. Dive into captivating webinars, insightful blogs, meet the team, and explore inspiring stories, all thoughtfully designed to enrich your journey.
UI Kit & Components
The Shkolo UI kit we've meticulously designed is the cornerstone of our approach, ensuring that every page maintains consistency with our cohesive art direction throughout the entire platform.
