building a

Responsive web design

For OmaVape, a Philip Morris Finland sub-brand focused on educating adults on everything about smoke-free alternatives

Introducing 

the client

OmaVape is a Finish website discussing the pros, cons and “how to’s” of vaping, heated tobacco and other smoke-free alternatives. 

My part in 

the project

For this project, I was both the lead designer and the project manager in charge of the rebuild.

I have collaborated with the client since 2022, and I am currently maintaining and updating the website for a better performance and UX.

All with the help of a few

tools used

I created the web designs in Adobe XD, and the icons using Adobe Illustrator.

The gifs you see on the website are mostly done in Adobe After Effects from videos provided by the client. 

Some of them though, I exported as image files and re-animated in Photoshop for a smaller size GIF file.

Challenges of

the brand

We used light, vibrant colors and a custom font family provided by the client.

But, the site has almost no imagery or videos because of the tobacco industry regulations in Finland.

Instead, we took advantage of the text is and big bold letters to replace the “banned” media and ensure an effective communication with OmaVape’s users.

Playing with

Iconography

Another way to communicate with OmaVapes users was through icons. 

I created these using Illustrator, and are used as Category Icons for the blog.

Getting away with a few

Animated gifs

One exception to the “media ban” is the site’s Recycling campaign page for which I created a few animated gifs to show the recycling process.

The gifs are created in After Effects and exported through Photoshop for image size optimization.