Website for product and industrial designer who creates complete experiences
Mirko Romanelli, a product and industrial designer focused on minimal design, elevated by details and materials.
About Mirko Romanelli
Form, function and meaning balance
Mirko Romanelli is a Product and Industrial Designer based in Florence, Italy. He offers end-to-end support in product development, covering everything from initial research and concept creation to ideation, sketching, 3D modeling, and rendering.
He balances form, function, and meaning through attention to detail and careful material selection. His designs stand out with a distinct aesthetic signature, defined by simplicity and conceptual clarity, always emphasising the user experience and effective communication.
Product design strategy
Mirko Romanelli’s approach is to develop products with a minimal design, giving great importance to concept and storytelling, in order to build a solid relationship between user and product expressed through functionality and ergonomics.
Goals
We proposed Mirko a collaboration to redesign and develop his personal website since we admire his product designs and their aesthetic appeal. Mirko’s commitment to minimalism, concept-driven design, and the artful balance of function and storytelling inspired us, and we saw a chance to bring his digital presence to a new level. Our primary goal was to redesign and develop his website, aligning it with modern design trends and aiming for an award-winning digital experience.
The challenge
Building the website that could reflect Mirko Romanelli’s refined aesthetic and philosophy came with its own set of challenges. To bring his dedication to minimalism, concept-driven design, and storytelling into a web format, we needed to balance visual appeal with functional clarity carefully.
We worked to capture the essence of his brand through deep research and thoughtfully designed elements. Bringing these concepts to life on Webflow also required technical precision to ensure smooth performance and interactivity—all without losing the minimalist feel.
Process
The first step was a thorough research to understand Mirko Romanelli’s vision and design values, ensuring that every step was aligned with his brand’s essence.
Research
We conducted in-depth research to gather information about the client’s preferences, style guidelines, brand attributes, and user personas.
These findings laid the foundation for developing stylescapes, which showcased a range of stylistic options to guide the brand’s visual identity and explore creative possibilities.
Logo design
We experimented with different shapes, line weights, and typography to achieve a versatile logo that would fit the brand identity. The result was a set of logo options that provided flexibility and cohesion, allowing Mirko to choose the version that would represent his brand.
Branding identity system
With the logo as the starting point, we developed a cohesive brand identity system that extended to typography, colors, and other essential visual elements. While we initially explored color variations, we ultimately followed a purely minimalist palette, with no accent colors. This decision allows Mirko’s work to take center stage on the website.
The final identity system embodies simplicity and balance, ensuring a consistent and refined expression of Mirko’s brand.
Wireframing
While developing the brand identity, we simultaneously worked on wireframing to ensure cohesion between design elements and site structure. The key goal was to work on a solution that would offer something new, unique and still functional.
UI design
Altogether, we wanted the UI to reflect a blend of professionalism and creative vision, emphasizing Mirko Romanelli's unique style. The layout is intentionally clean and uncluttered, with subtle dynamic elements to add interest without overwhelming the viewer. A neutral color palette was chosen to keep the design flexible and adaptable to various types of products.
Home page
For the homepage, we proposed a layout that embraces a rhythmic, flowing arrangement to introduce Mirko’s work without imposing a strict hierarchy. This dynamic structure guides visitors through projects and personal brand elements in an interactive format, sparking curiosity and engagement.
Works
We developed multiple concepts for the Works page, each aimed at presenting Mirko’s projects in a fresh and captivating way. Moving beyond a traditional grid, we explored dynamic layouts that establish a rhythmic flow, inviting users to engage with each project individually.
Contact page
Crafted to be straightforward yet inviting, the Contact page reflects the minimalist design, making it easy for visitors to reach out.
Responsive
We also focused on responsive design to ensure the site adapts smoothly across all devices, preserving its clean aesthetic and interactive elements.
Development process
The development phase focused on bringing the design to life with both speed and flexibility, creating a visually dynamic yet highly responsive website. We built the foundation in Webflow, but to add the level of interactivity and animation we envisioned, we brought in additional tools and custom code. By blending these technologies, we created an experience that feels smooth, engaging, and visually captivating.
Webflow development
Webflow provided an excellent foundation, offering a user-friendly, no-code platform that enabled quick and precise development. Its powerful CMS functionality allowed us to structure and manage content effectively. Although Webflow supports many native animations, we wanted to go beyond its capabilities to achieve an even more refined, interactive experience.
Custom code integration
To enhance animations and interactions, we incorporated GSAP (GreenSock Animation Platform), a powerful framework that provides extensive control over animations, allowing us to craft smooth, immersive transitions. For the header animation, we used WebGL and fragment shaders to add a 3D blurring effect.
Additionally, we implemented responsive adjustments, optimizing load times and creating seamless transitions without placeholder delays for a polished and adaptive final product across all devices.
Customer comment
The work looks great and I am very pleased with the website! I really like the solutions used, I find them very consistent with each other and they give dynamism to the site.Mirko RomanelliProduct and industrial designer
