Nexgrill
Firing up a new website
MY ROLE
Concept Designs
AGENCY
Magnetic Creative
Perspective view of grayscale wireframes for a product website, showing multiple pages including product landing, detail, homepage, and explore, with placeholders for images, videos, and text.Group of friends enjoying a barbecue with a large modern gas grill and sliced grilled meat on a wooden board.Three gas grills: two Evolution 6-burner gas grills with side burners, one in stainless steel and one in black, and one Deluxe 4-burner stainless steel gas grill.Outdoor grill loaded with vegetables and meats, next to a grill basket filled with vegetables and condiments on a patio table.Black and white photo of a shirtless man holding a paddle, with tattoos on his left arm and chest, looking into the distance.Nexgrill Evolution 5 Burner gas grill with smiling people in the background and text highlighting features and buying options.Three people enjoying grilled food outdoors at sunset, passing a plate across a table with fruit and drinks.Top image shows a stainless steel grill with multiple control knobs. Bottom image shows colorful skewers of meat and vegetables cooking on stainless steel infrared plates.
MY ROLE
Concept and Production Design
AGENCY
Magnetic Creative
Working with the incredibly talented team at Magnetic, I helped with the redesign of nexgrill.com. Magnetic had already created the new brand assets (colors, red stripe, asymmetrical grid, textures, etc.), so I took those elements and designed pages that highlight both the products and the brand.
Challenge
Nexgrill needed a website that brought its refreshed brand identity to life while making a broad range of grills easier to explore. The challenge was to balance compelling product storytelling with clear navigation and product information, helping shoppers find the right grill and confidently move toward a retailer.
Solution
Working with the team at Magnetic Creative, I translated the new visual identity into a clean, product-focused website experience. I developed wireframes and page designs for the homepage, navigation, and product details, using the brand’s color, textures, and asymmetrical layouts to add personality without distracting from the products. I also created interaction prototypes to communicate the intended experience to developers.
Here's how i did it
Wireframes
I didn't want them to be too high-fidelity to dictate too much of the design, but I also didn't want them to be too low-fidelity to where there would still need to be a lot of work done in the design phase. I think I found a nice middle ground that was very helpful with a tight deadline.
Perspective view of grayscale wireframes for a product website, showing multiple pages including product landing, detail, homepage, and explore, with placeholders for images, videos, and text.
Homepage
Clean, simple, airy. I wanted to make sure to highlight the products and the brand assets, but also add in some elements of visual interest.
Nexgrill homepage featuring gas grills, a featured recipe with ingredients for grilled chicken, images of grilled food and people enjoying barbecues, and promotional text.
Mega Menu
A sample animation created in After Effects to help show the developers how I intended the Mega Menu interactions to work.
Product Detail Exploration
Early design exploration for the product detail page.
Nexgrill Evolution 5 Burner & Side Burner outdoor gas grill with control knobs and storage cabinet, showcasing infrared technology and accessories.
Product Detail
After rounds of revision to the previous concept, I created this animation in After Effects to show how the product detail page would look.
Outcome