Flowerspace — Increasing the click through rate.
Background
In 2022, Flowerspace a flower industry research and development agency wanted to position themselves online and enable visitors to know what they do and reach out to them. They needed a website to help them achieve this
Role
I was responsible design strategy , visual design and user testing. My aim was to help the client uncover what they wanted to achieve with the website by asking them questions and helping understand their business goals which informed my design decisions. Although I was the sole designer on the project, I collaborated closely with a product manager, content designer ( all copy was provided for me) and an engineer.
Defining the purpose
My first priority was to understand what the business really wanted to achieve with this product(website) is it sales, communication, information? This led me to drafting a series of questions which are below
Questions
- What do you want to achieve with this landing page, to inform, onboard etc. ? To inform visitors about what we offer as an agency and make contacting us through different channels easy.
- Any existing color guide and system? Yes, purple
- What do you want the web brand tone to be like? went further to break down, into words simple and classic, luxury and elegant ? Gamified, Techy and Futuristic.
Tasks
After understanding the requirements I created a task for myself to complete the project of which are:
- Define color and typeface
- Designing the website — ( a) Hero section (b) Present the information of what the agency does (c) Contact us(footer)
Defining the color and typeface
While exploring fonts and what the surface color of the website would be what guided my decision making was based on the research and understanding stakeholder requirement “gamified” “techy” “futuristic” .
For the surface color a dark themed linear purple was used to fit into giving the website a gamified look. The stakeholder wanted us to go dark-mode direction as well
Designing the website
The Hero section
Understanding what the goal of the website was to do , the hero section design was very critical in passing across of what the agency does to visitors so they contact the agency. Contacting the agency was the crtical call to action that we wanted the visitors to do.
Presenting the information in cards
This sections goal was to present the content given to me in the designs highlighting the different things the flower industry agency does and thier approach to it. There were different iterations done to arrive at the final version
iteration 1 when tested was looking too blank and was giving a “blog content”, iteration 2 was done with the aim of making the card more presentable while still making it look interesting, the use of gradient to the card container was done to this effect, Iteration 3 was done with the aim to fill in the gap of the “lack of identity” the cards had, to fill this gap I tested putting 2d & 3d icons into the card and the final version that went forward was the one with 2d icons. The underlying problem I had when all the cards were fitted on the website section as the card text where not of equal length so a I had to find a way to balance the the layout without distorting it
The footer
The contact us button on the hero section each time its pressed navigates to the footer where we have all the different ways by which the visitor can contact the agency.
Results
6 weeks after launch of the website the agency recorded a 100+ visitors , Click-through Rate (CTR) on “Contact Us” CTA of 55% .
Key lessons learnt
While working on this project I did really learn importance of asking the stakeholders right questions to give clarity not just to you but for them as well , also merging what business requirements were in intersection with designs. There will always be a better way of solving a problem when designing so its okay to try out multiple iterations as well.
