If you were browsing the web circa 1998, splash pages were everywhere. Flash-powered intros with dramatic music, spinning logos, and “Welcome to our website!” animations were a standard part of the design process. Those days are long gone, but they haven't vanished entirely. Brands still use splash pages for age verification, country and language selection, or simply to create a bold first impression.
I recently took my love for the old internet to the next level by creating a personal website with the Macintosh Classic vibe in Framer. In this blog post, I'll take you through my process and the tools I used to create this throwback design.
Creating the Macintosh Classic Vibe with Framer
One of the key elements of my design is the use of ASCII art and the dither effect. Shout-out to Alex Harris for creating a fantastic image-dithering tool called Ditherit, which I use often in my designs. These effects give the design a retro feel and harken back to the early days of the internet.
I use the Drag Effect in Framer to move icons and windows around on the page, just like on a desktop computer. It only takes a few clicks to set up – simply go to Effects → Drag and customize the settings to your liking.
Designing for Mobile Devices
While the Macintosh Classic design is perfect for desktop computers, it doesn't necessarily translate well to mobile devices. The desktop UI lacks practicality on smaller screens. However, with Framer, creating breakpoints is a breeze, allowing me to simplify the design for smaller screens.
Using Components in Framer
To make my design more dynamic, I used components in Framer to create multiple file types and modify the name of each file. This allows me to quickly and easily make changes to the design without having to manually update each element.
Step into the future of design
Join thousands using Framer to build high-performing websites fast.
