Website redesign for a product marketing agency
Digital Tailors
🔎 Background
Digital Tailors is a product marketing agency. They work with tech companies that need a full-stack product marketing team and help them scale their business.
Digital Tailors got a new brand identity. They wanted to update their existing website and content.
As the sole designer, I collaborated with the Digital Tailors’ team, a product marketer, a content marketer, and a developer to bring the website’s look to the new company’s visual identity.
🤔 The problem
My high-level goals were to redesign the website focusing on mobile screens, integrate the new brand identity, and help the visitors understand their work process.
I had to find the best way to showcase as much text on the website and not lose visitors immediately, fit all text into a mobile-first design solution, and integrate the new brand identity into the website.
⚙️ Working process
After the introduction email sent by my manager, I only worked with the Digital Tailors’ team.
I managed and executed the entire project, conducting meetings, presenting the design, and exporting and sending the files to the developer.
I designed the website using Adobe XD. I also used Adobe Illustrator to use and adapt the new brand elements to my needs. To help the fronted developer, I shared the design using Adobe XD’s development features.
🎨 Exploring the design
I organised an onboarding meeting with the Digital Tailor’s team. The scope of the meeting was to understand the industry and ask about the company’s services in detail. I also asked about the prime goal of their website.
In the first meeting, I also aimed to let them know about the assets I will need to start the design process. I asked about the files with the new content, specific graphic elements, and the new brand book with all assets.
Most of their visitors come from mobile, and they wanted to start by designing the website for small screens.
Another reason for starting the design of the mobile screens first was the text, so much text. I decided with them that it is a good idea to approach and optimise the phone screens.
I did four revisions until I found the solution, and they were 100% happy.
The design proposals for one of the pages, from the first to the final version.
They loved to write. This is not a bad thing considering the nature of their work.
When I started working on the first website iteration, I had to work with the long content they provided. I had to find the best way of featuring the text and keeping it readable at the same time.
In the first days of working with the content, I offered multiple suggestions on where the text could be shortened. I organised multiple sessions where I presented the text applied to the website to present and discuss its shortening.
The content suffered multiple updates including the structure and length to offer the best reading experience.
They didn’t want to use images or complex graphic elements on their website. So, I used text alignments to draw attention and emphasise the key phrases.
I used icons to support the text in specific sections. The team didn’t want to invest time in designing icons. I had to search online icon packages to fit the website design. After this, we chose the ones that best describe the content.
A selection of icons created for the website.
The structure of the content alignment for mobile and desktop.
I had to follow and include the new visual identity to create a consistent visual language. I used decorative elements the brand book provides to support the overall composition.
I designed the desktop version on a 1366px screen resolution to include all desktop devices.
The design keeps the mobile structure adapted to a larger screen. The only change is in the header, changing the colour when the user scrolls the content.
When the files were done, I exported the assets needed by the developer and shared the design using Adobe XD’s development features.
📖 Learn more about the client and their product.
The website may suffer changes compared with the presented design.
✒️ Final thoughts
This project allowed me to work and collaborate with an external team and deliver a website with a fresh and efficient interface.
I was challenged to create a great experience for the reader to follow and understand big blocks of text.
I enjoy using my design skills to make people's lives simpler and better. I find it fascinating to understand the motivations behind product usage and how people interact with them. I see my design journey as a never-ending process of developing new skills and choosing the best tools to provide unique and optimal design solutions for every individual.