Client Needs

Our client required a comprehensive design for both a website and a SaaS platform that conveyed a sense of premium quality and trustworthiness.

Although he had collaborated with several design agencies previously, he had not yet found a design that truly met his expectations.

Art Direction

Our team aimed to develop a design with a black theme to align well with the company's name. The objective was to create a sophisticated design featuring 3D animations for a contemporary style.

Our art director initiated the process by designing the "hero section" (the first section), incorporating a 3D animation of a black hole. This was combined with a selection of modern and elegant fonts, setting the tone for the remainder of the project.

Landing Page

The landing page was thoughtfully designed and structured by our team. We first focused on building the wireframe of the page to seek validation from the client. Following this, our senior copywriter proceeded with the copywriting for the page.

Once the structure and copywriting were validated by the client, our team of designers constructed the rest of the landing page, adhering to the guidelines set by our art director.

SaaS Platform Design

The second phase of our project concentrated on designing the SaaS platform. Our client granted us complete creative freedom concerning the platform's structure. Based on their research, our team of business analysts developed a foundational structure.

We chose to create a simple and user-friendly platform that adheres to the 80/20 principle. This approach ensures that all vital information a Blackalgo customer needs is readily available, without incorporating unnecessary features or superfluous elements.

We meticulously designed the entire onboarding process to maximize the account creation and active user conversion rate by simplifying the onboarding process.

Additionally, we designed an Admin Dashboard that enables administrators to view the SaaS statistics and manage user accounts.

Figma Structure

The transitions between each section were meticulously designed and detailed in the Figma file. Furthermore, an animated video was created to guide the development team on how to code the pages.

Several design proposals were also made for the sections.