Gameboy – Framer Concept Interactive Micro Website by Chris Nutbeen

This project was built with Framer.

Check it out

Gameboy – Framer Concept Interactive Micro Website

Chris Nutbeen

Low-Code/No-Code

UI Designer

Framer Designer

Framer

A interactive Gameboy template on Framer to experiment with nested components and design without the need of Figma.

The Gameboy only uses 1 svg for the Nintendo logo, no other images and 100% no code.

View Demo | Get Remix

✱ The Design

It was important to see how far I could design the visuals directly in Framer, instead of using Figma to create the UI and elements.

Everything on this Gameboy was created directly in Framer with no external resources, except the blue Nintendo SVG logo. Even the pixelated Nintendo logo on start-up is a font.

I was very impressed with the outcome I was able to achieve soley using Framers features. The only aspect I think Figma could have improved in the Pad, as the shadows and lighting to achieve a clean look was tricky in Framer.

Nested Component Navigation in Framer

✱ The Experiment

This experiment was to review the capabilities of nested components before having to use code. While code would make this a little more elegant in terms of component structure, the outcome is ultimately the same, whereas with no-code the navigation has to be within one-level of the screen to work correctly.

Loading Animations in Framer

✦ The Stats

Timeline: 3 days Budget: N/A No. of components: 10 Deliverables: Finished Framer project file and Remix.

Impressed? Want me to create a Framer website for you? Check out my Framer services and book instantly ⚡

Like this project

An interactive Gameboy 'link-in-bio' template made completely in Framer with 100% no-code. Displaying how nested components can be used to create interactions.

Likes

Views

Clients