Visual Design
UI/UX Design
Web Development
This is some text inside of a div block.
February 2022

About project

Violet AI is an AI consulting and venturing business based in Stockholm. They’ve been around for 7 years and have been early into the AI/ML game.

During last year they did a comprehensive rebranding and ended up with new name, logo and design.  

Now they need a new website to reflect the progress they’ve made.


They are very fond of  website, and a lot of sweat and soul have gone into the copy, layout and pictures.

But now it’s time for something new. The current website mainly describes our venturing business and from this perspective it’s still highly relevant.


They perceive themselves as a tech agency with a strong component of both creativity and business acumen.

In the Nordics their main competitors are rather ... boring... and do not stand out as particular creative.

The reason why they’ve chosen a colorful and impactful design and tone of voice is both because it reflects are team and soul, but also because it makes them stand out in the crowd.

Storage Scholars website on laptop and mobile
First screen of homepage
Following the principle of user-centered design, “Give visitors what they’re looking for,” we implement the following strategy
Redesign process

We used mind-mapping to envision the website’s information architecture, prioritize the hierarchy of pieces, and create a fully functional website. To enhance the overall UX, we must anticipate their needs and present relevant information at each step. As a result, the site structure is influenced bt various user types. It was able to simplify user flows between sites based on this by deleting unneeded pages, combining existing ones, and creating new ones as needed.

User research
Understand your client first
User flow/Sitemap
Create solutions by creating user flow
Low-fidelity version for website
Clickable Prototype
To know how website will work
Create Style guide and components
To make design look consistent
High-fidelity design
Make them to be prettier and more attractively
Build in Webflow
Make design come true
What challenges have our designers overcome?
Mesh gradient
See solution

Their colours branding are quite complex. They use many gradient of many colours. Therefore, we had to find a way to combine all of their colours on the hero banner. Luckily, we can use plugin Mesh Gradients in Figma to create the background which have all of 4 main colours they want are: pink, blue, violet and dark blue. We also created the interactive gradient on hero banner. The gradient will change when users hover on the background. It looks very smooth and modern.

retouch image
See solution

To create the consistency and increase brand awareness, we also retouched all of the images used on the website. The images were overlaid with the mesh gradient created by 4 branding colours.

Project Storage Scholars Pages
After redesign


Canela & Circular Std
Font Poppins

Circular Std Font is a humanist sans-serif font created by Lineto with geometric and organic forms. It is a quality sans-serif font with solid geometric types. You should utilize it for websites, prints, and so forth. Circular Std offers full support for the Latin alphabet while also supporting many other alphabets.

Colour Pallete

Gray is a neutral color and is the foundation of the color system. Almost everything in UI design — text, form fields, backgrounds, dividers — is usually gray. Clients also want to use gradient combining pink and purple. This gradient is used for buttons to attract attention.


This illustration of the machine is to show the company's professional and smooth workflow

No items found.
Violet Ai Illustration
Icon NFT
Icon NFT
Icon NFT
Icon NFT
Icon NFT
Icon NFT
Icon NFT
Icon NFT
progress icon
Think Icon
Saying No
Two Heart
Well Done
Helping Hands
Measuring Tape
Electronic Chip
Flash Icon
Mechanical Tools
Program Development
What challenges have our developers faced?
See solution

The client wanted the website to have an animation in the background, as the color branding of the website was quite complex, it was using many colors, so we had to find a way to use those colors to make an appealing animation for the background, usually, webflow developers use CSS color gradient property for the such background which looks very simple and not a modern practice at all.


At webnem, we always focus on quality and try to make the best possible thing. We made a custom Java script gradient animation using third party javascript library. By doing this we were able to create a smooth animation and it gives the same result on devices and is constantly changing its color gradients matching the website color scheme.

"Adil shows proficient experience in both UX/UI design and Webflow development. We worked with Adil for two months on two separate Webflow/Shopify landing pages and he was a pleasure to work with. We highly recommend Adil's services to anyone in need of UX/UI design or Shopify/Webflow development. His attention to detail, his communication, and proficiency across all aspects of this process were top-notch."

By Violet AI Consulting

NEXT project
We can bring your website experience to the next level
Let’s talk with us
Right Arrow