Scintillant Ventures

2023

Website Design

Overview

Scintillant Ventures is a Vancouver-based startup building digital tools for North American educators. They needed a website that clearly communicates their mission and showcases their products. I finished the end-to-end website design process from wireframes to high-fidelity mockups to final development using Figma and WIX. The final platform delivers a clean, scalable experience that balances brand presence with user-focused clarity.

My Role

Branding, Wireframing, Prototyping, Website Development on WIX

Tools

Figma, WIX

Site Architecture

Site maps

I first mapped out the site structure based on the provided content, with a focus on fast access to key information.

The navigation prioritized clarity and simplicity:

Home: Company intro, featured products, and subscription form
Who We Are: Brand values and team background
Our Solutions: Clear product listings and overviews
Blog: Educational content and product updates (Wix built in)
Contact: Inquiry form for educators and partners

This structure minimized navigation friction and kept core content accessible within two clicks.

Wireframing

I started with low-fidelity wireframes to define layout, content zones, and navigation patterns. My focus was on:

Making key CTAs (like “Try It For Free” or “Subscribe”) catchy
Structuring content to clearly explain products like Classroom Studio
Designing for responsiveness from the beginning

During this stage, I noticed that the Who We Are and Product pages used similar horizontal layouts, making them feel visually repetitive. To improve page distinction and user recall, I redesigned the Who We Are page using a vertical structure that better matched its narrative flow and made content easier to scan.

Mockups

Building on the wireframes, I created high-fidelity mockups to explore visual hierarchy, brand application, and layout balance. Once real content and brand elements were added, I refined:

Color and imagery to reduce visual noise
Typography and spacing for readability across devices
Section pacing to avoid dense or empty areas

One key refinement during this phase addressed the length and scannability of the Our Solutions page. Listing multiple products in a vertical stack created visual fatigue and made it harder for users to understand all available offerings quickly.

I redesigned the section using horizontal carousel cards to support quick browsing without overwhelming the layout. To maintain consistency, I also aligned the visual language of individual Product Pages with the Our Solutions banner, reinforcing a smoother page-to-page transition.

This round sharpened the site’s visual clarity while keeping usability front and center.

Final Design

The final design prioritized clarity and scalability. I built a fully responsive site in WIX, using structured layouts and minimal visual noise to support fast comprehension.

Key design choices included:

Responsive grids for desktop, tablet, and mobile
Clear content hierarchy with consistent typography and spacing
Simple CTAs and intuitive flow for time-sensitive users

Style & Components

Style Guide

To establish a clear visual identity, I first developed a focused style guide that defined the tone and brand presence of the site:

Logo: Clean and recognizable, reflecting both professionalism and approachability
Color Palette: Soft blues and neutrals—calm, trustworthy, and easy on the eyes
Typography: Screen-friendly fonts with strong contrast and legibility across devices

The goal was to create a visual system that felt modern but approachable—especially for educators who value clarity over flash.

UI Kit

With the visual style defined, I built a UI kit of reusable components to ensure layout consistency and ease of future updates:

Buttons (primary/secondary): Designed with clear hierarchy and ample tap area
Forms: Clean, accessible input fields for contact and lead generation
Navigation Tabs & Menus: Simple, responsive, and screen-reader friendly
Cards: Used in blog previews and product highlights, with consistent spacing and icon usage

This component library made it easy to maintain visual consistency and build new pages without starting from scratch.

Reflection

This project taught me how to balance branding and usability—especially in content-heavy sites. I learned to:

Design systems that scale with a growing product
Build flows around how users actually navigate and make decisions
Stay flexible through late-stage content shifts

Clarity, not visual flash, was the right choice for an audience that values function above all.

More projects

To play, press and hold the enter key. To stop, release the enter key.