Tospaa Coding Game
Tospaa is a B2B/B2C Social Enterprise which is an unplugged (screen-free) coding game designed for early age coding education and is a social enterprise aiming to reduce inequalities in coding education.
Many public schools in Turkey do not have suitable facilities for coding education, such as computer labs. The initiative also produces solutions for providing algorithms and coding/computational thinking education in these schools.
End-to-end Product Design
Design Systems
User Research
Usability Testing
Collaboration w/developers
Additional Touches
Coding Expertise
Implemented design seamlessly using HTML & CSS, ensuring a visually appealing and functional website.
SEO Optimization
Optimized SEO settings for organic user traffic and discoverability. | Google & YouTube Search
Digital Marketing
Executed a digital marketing funnel to convert social media users.
Mentorship
Mentored individuals in learning design, focusing on user-centric and target-oriented educational resources tailored to user habits.
Tospaa struggled with low user engagement. Their landing page, plagued by limited traffic and short visits according to Google Analytics, wasn't effectively capturing users' attention.
More user engagement across the board, especially in "About Us" and "Educational Resources."
Successful design implementation, overcoming initial challenges with user acceptance and information discovery.
+261%
organic search users
+82%
user engagement
+70%
visits on 'Free Educational Resources'
N. Alp Ar
Founder | Tospaa
UX Research
Stakeholder Interviews
Conducted insightful interviews with stakeholders to gather pain points and align with company goals.
Documented insights to form a foundation for the design process.
Created comprehensive sitemaps to establish clear order and organization between pages, providing cohesive and intuitive navigation.
Persona Tailoring
Catered to the unique needs of primary school teachers and parents with primary school-aged children, considering distinct requirements for each persona.
Designed different pages tailored to effectively meet the specific needs of each group, such as Tospaa’s Workshop page.
Decision Process
User Empowerment
Meticulously charted users' paths to identify opportunities for streamlining and enhancing their journey.
Employed robust UX methodologies, including competitor audits, to gain insights and inform the approach.
Compiled a comprehensive report from competitors' analysis, focusing on optimizing information architecture for a seamless user experience.
User Flows and Sitemaps
Strategically crafted user flows to understand site organization from the user's perspective.
Identified areas for improvement or redesign to streamline the user journey and enhance overall experience.
Information Architecture
Introduced a dynamic slider feature showcasing new products across multiple slides for a visually engaging experience.
Implemented intuitive arrow controls for seamless browsing through slider content, increasing website traffic and visibility of latest offerings.
Sketches
Utilized sketching to rapidly explore and iterate on ideas, fostering creativity and quick problem-solving.
Leveraged sketches as a low-fidelity medium to test and validate design concepts, identifying potential flaws or areas of improvement early in the project.
Wireframes
Used wireframes to validate design concepts and strategically place CTAs for better usability.
Highlighted recently released products and news on the homepage through a strategically placed dynamic slider, increased website traffic and visibility of latest offerings.
Design Implementation and Brand Alignment
Employed visually appealing icons throughout the interface to establish a visual connection and enhance engagement.
Aligned design with the brand's identity by employing exact brand colors, introducing consistency and cohesiveness.
Quick look — How did Tospaa appear before this design?
