Web designers are always in search of creative ways to highlight their work. If you need inspiration for your own portfolio, check out the grid experience French designer Fanny Demier created to showcase her favorite projects.
“When you click on the ‘work’ column, you’ll see a grid within a grid, like a ‘mise en abyme,’ inviting you to enter my world,” she says. (“Mise en abyme” is a fine art term that refers to placing an image within itself.) This world, Demier explains, merges her love of both order and spontaneity, and invites visitors to get lost in endless columns, layer after layer. “The minimally designed grids create an open space to dive into,” she says. Here, as part of our How I Made This series, she shares how she created them.
Describe your website.
I’m a designer mainly focused on editorial design and visual identity creation. In my personal time, I like to explore the potential of animation and 3D. My website is meant to represent these two axes of my work: my love for layout, grid, and print with a special touch of motion, digital, and spontaneity.
What was your goal in designing this website?
I was looking for a way to depict who I am. I like spontaneity and movement but also order and framework. I like investigating what’s possible within a defined setting. I also wanted a website that people would remember and have fun with; something playful.
What’s the one design feature on your site with a major wow factor?
The most striking element on my site is the use of the removable grids inserted one in the other. My site is constantly evolving, adapting to the visitor's desire by showing and hiding elements.
Follow along with Demier and create a nesting grid of your own in under ten minutes.
How long did it take you to build the feature from start to finish?
I took part in the Wix Playground Academy Europe program in 2022. I already had a website made with Wix, but this program allowed me to discover Editor X and to create a more personalized version. Between the research, inspiration, graphic references, and exciting lectures from worldwide designers, it took me five weeks to make my site.
What’s your one piece of advice to a fellow web designer who wants to try it themselves?
Think out of the box. When I created my website, I faced a lot of challenges that limited me in what I wanted to achieve (some tools didn't exist at the time). So, I had to find solutions to do what I had in mind, like the effect of these three main columns that close and open. There is actually a lot of ingenuity behind it and a few hundred lines of code.
If I could give a second piece of advice, it would be to really spend time researching and sketching before you start building, especially if web design isn’t your main field. I lacked references at the beginning and had a hard time laying out the basics of my site before feeding off of other people's work. Nothing can be accomplished alone.
Creating a grid like Demier's, in a few steps.
What’s next for you?
I recently moved to Toulouse to take on a new role as a graphic designer/layout artist. It's a very diverse position in which I work on layouts, photo editing, social media content, and 3D animations. In addition to this job, I enjoy doing personal projects and freelance work. I'm always looking for new encounters and experiences.
