Close cursor

Get in touch

First CSS Design Award for 2020: Weaver Popcorn

Excited to announce our first award for 2020! Weaver Popcorn wins a CSS Design Awards SOTD.

Let us tell you a bit more about this project and the work we created for the brand.

The Task

Based in Indiana, Weaver Popcorn Company was founded back in 1928 and is the largest popcorn company in the U.S. Their popcorn is sold in more than 50 countries around the world.

We were contracted to redesign the architecture, visuals, animations and front-end code of Pop Weaver’s website. The back-end and CMS were handled directly by the client’s in-house development team.

Design Elements and Style

The site stands out with 3D animations designed and rendered from scratch by our team. From a 3D popcorn box and flying kernels to an animated popcorn-making machine, we aimed at creating a truly memorable and immersive user experience into the word of Pop Weaver. 

All 3D models were built and assembled, element by element, meaning we can animate each image, enhance it, render it, and make it come to life no matter where or how small.

Navigation UX

We chose to ignore the popular horizontal menu bar and made the bold decision to hide the menu vertically, on the viewer’s left. This freed the full screen to display a cinematic vision of Pop Weaver. The open space and large-scale images create a fantastic mood and presented the brand as the king that it is. The menu design is a clever visual solution and gives easy access to information from any page of the site.


Custom Visuals

The visual assets, graphics, videos, and 3D animations are all authentically photographed or made in our studio. We popped lots of popcorn and had a lot of fun shooting photos and videos on several backgrounds for the different screen resolutions needed.


Development Challenges

We faced several challenges when coding the round shapes of the website design. Pop Weaver’s logo has a curved outline. To align the site to brand’s visual identity we designed arched titles, created wavy transitions and mapped Pop Weaver’s history cards in a dynamic circle.


What Would We Do Differently if We Could Start Over?

This website was built over 2 years ago. If we had to start over today, we would use a newer front-end framework to code the design applying the newest optimization best practices and standards. 


User Engagement Strategy  

The website carries many micro-interactions and engaging visuals. Every small design element was planned to create a whimsical but carefully timed sense of purpose. Calls-to-action are designed to grab users' attention. We even lit the entire site at an angle, so the light highlights specific details.


Our team was honored to work alongside a stellar brand like Weaver Popcorn. The website design was created 2 years ago and has now been replaced by a different version online.

 

For more information about the 3D animations and design we have created, have a look at Pop Weaver's case study

* you shouldn’t miss