Loading ...

Responses by Vincent Mazza, managing partner, eDesign.


Background: This site was initially intended for a primarily business-to-consumer audience that Pop Weaver was targeting with its consumer pack, available at most Walmart locations. However, the project midway required a shift and the Pop Weaver has since turned all its focus on its business-to-business connections.

Design core: The site stands out with exceptional 3-D animations designed and rendered from scratch by our team. From a 3-D popcorn box and flying kernels to an animated popcorn-making machine, we aimed at creating a truly memorable and immersive user experience to the word of Pop Weaver. All 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.

Favorite details: The Pop Weaver website was designed without using any stock images. The photography, visual assets, graphics, videos and 3-D 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.

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

Navigation structure: 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 beautiful, 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 both a very clever visual guide with icons and animation but also provides easy access to information from any page of the site.

The website carries many microinteractions and engaging visuals. Every small design element was planned and timed to create a whimsical but carefully timed sense of purpose. Calls-to-action are designed to grab the user's attention, and we even lit the entire site at an angle so the light falls on specific design details, creating the feeling of being in a unique place.

Technology: HTML5/CSS3/JavaScript and custom code. We were contracted to create the architecture, visual designs, animations and front-end code. The front-end code of the website was written to support a headless CMS integration. The back end and CMS were handled directly by the client’s in-house development team.

popweaver.edesigninteractive.com

Browse Projects

Click on an image to view more from each project
X

With a free Commarts account, you can enjoy 50% more free content
Create an Account
Get a subscription and have unlimited access
Subscribe
Already a subscriber or have a Commarts account?
Sign In
X

Get a subscription and have unlimited access
Subscribe
Already a subscriber?
Sign In