Daniela Castelbranco
Kai Ting Lin
Graphic Designer
Web Designer
Webflow Developer
Figma
Notion
Webflow
Intro
Daniela Castelbranco, an innovative architect renowned for her transformative use of future-proof materials in domestic spaces, approached me for a unique website project. She sought a digital platform that would reflect her dedication to customization and originality, setting her apart from conventional architectural approaches.
What made this project exceptional was my dual role as both the designer and developer of the website, which I built entirely by myself using the no-code platform Webflow. My objective was to create a website that not only showcased Daniela's architectural projects but also captured the essence of her craft, emphasizing the values of customization and originality.
My Role
I led the design and development of a fully customized website that perfectly captured Daniela's distinctive architectural style.
Project Task/Challenge
The challenge was to create a website that not only showcased Daniela Castelbranco's architectural projects but also embodied the essence of her craft—customization and originality. It needed to be a digital space that stood apart from the ordinary, reflecting the uniqueness of her work.
Project Solution
To tackle this challenge, I embarked on a journey of creative design and development. Every aspect of the website, from its structure to its components, was meticulously crafted to ensure it reflected Daniela's distinct style.
The key elements of the solution included:
1. Full Customization
2.Handcrafted Components
3. Leveraging Webflow for Seamless Development
Visual Research
To gain a comprehensive understanding of Daniela Castelbranco's architectural style, brand identity, and target audience, I embarked on an extensive visual research journey. Daniela's unique background in textile design was a pivotal starting point for my exploration.
1. Exploring Daniela's Architectural Style
Recognizing Daniela's transition from textile design to architecture, I delved into her previous work and design philosophy. This allowed me to identify recurring motifs, color palettes, and design principles that she carried over from her textile design background into her architectural endeavors.
2. Unveiling Daniela's Brand Identity
Daniela's Signature
In my exploration of Daniela's brand identity alongside her architectural style, one standout element was her distinctive hand-drawn illustrations. These sketches bore the unmistakable mark of her creativity and personal touch, becoming a defining feature of her unique brand image. These illustrations not only showcased her artistic prowess but also represented her dedication to customization and originality, principles that echoed throughout her work.
Daniela's distinctive hand-drawn illustrations
Additionally, I conducted interviews and discussions with Daniela to gain insights into her personal vision, values, and the message she wanted her architecture to convey. This interpersonal interaction helped shape a more profound understanding of her identity as an architect.
3. Inspiration
Two sources of inspiration that significantly influenced my design decisions were architectural blueprints and Le Corbusier's modular design principles.
Architectural Blueprint
Architectural blueprints, with their precision and structured layouts, inspired the overall layout and navigation of the website, ensuring a seamless user experience.
Le Corbusier's Modular Approach
Le Corbusier's modular approach to design informed the website's grid system and the way architectural projects were presented, aligning with Daniela's pursuit of customization and originality.
4. Typeface Exploration
An essential aspect of this project was the careful consideration of typography. Typeface selection plays a pivotal role in conveying Daniela Castelbranco's architectural-inspired aesthetic and custom approach. To achieve this, I conducted thorough research and design work in the realm of typography.
Exploring Architectural-Inspired Typefaces
Herita-Geo, designed by Natasha Jen, makes use of a blue double line to accentuate its architectural quality and is composed of letterforms that extend horizontally.
Natasha Jen’s mutable, moving typeface for AIA (American Institute of Architects) gala expands and contracts
Custom Typeface Creation
Building upon the architectural blueprint inspiration and the custom typeface Herita-Geo by Natasha Jen , I ventured into the realm of custom typography. The goal was to develop a typeface that was uniquely tailored to Daniela's brand identity and design philosophy.
The initial custom typeface design proposal
Typeface Selection: Grotesk Remix
In a serendipitous twist, our final typeface selection, Grotesk Remix by Benoît Bodhuin, presents a fascinating synergy with Daniela's architectural vision. The font's diverse range of weights empowers a multitude of designers to harness its geometric essence in endless creative ways, aligning seamlessly with Daniela's affinity for slender typography. Grotesk Remix, despite its unconventional origins, remarkably mirrors the architectural spirit of precision and simplicity that Daniela holds dear.
Grotesk Remix
5. The Result
The above visual research results in a clean and elegant final design. It combines the unique Grotesk Remix typeface with simple geometric shapes reminiscent of architectural blueprints. This marriage of elements reflects Daniela Castelbranco's dedication to simplicity and originality. The final result embodies the essence of her craft and architectural precision.
Domestic Transformation
A central request was to not only showcase her impressive portfolio but also to underscore the powerful transformations achieved within these projects. To bring this vision to life, I devised a custom Content Management System (CMS) tailored specifically for managing her portfolio.
Highlighting Transformative Power: The Before & After Slider
At the heart of this showcase is a remarkable feature – a custom-designed slider that allows viewers to witness the before-and-after effect of Daniela's architectural endeavors. This innovative tool provides a dynamic and engaging visual narrative, highlighting the incredible metamorphosis that occurs within her projects. It serves as a powerful testament to the transformative magic that Daniela weaves into every space she touches.
Summary
In the culmination of this collaboration, we crafted a website that not only showcased Daniela's architectural prowess but also served as a testament to her unwavering commitment to originality and innovation. It became a digital reflection of her unique architectural style, setting her apart in the competitive architectural world. From the bespoke typefaces that echoed precision to the transformative power of the custom slider, every element was meticulously designed and developed to bring Daniela's vision to life.
This project stands as a testament to the extraordinary synergy between design and architecture, where the digital space mirrors the essence of a transformative architect, Daniela Castelbranco, known for her innovation, future-proof materials, and the power to reshape domestic spaces.
✦✦✦
Thanks to Kai-Ting I've improved my online presence. I recommend her services to anyone who creates their own signature design both offline and online. I have relied on her to achieve the goal because she is constantly looking for solutions to the brief. It was a pleasure to collaborate on determining the appropriate tone, color/texture, font, tools, and social media platforms. She clearly desires and delivers a satisfactory job.
Daniela Castelbranco
Architect Project Leader
2022
