Recently, I completed a web design and development project, delivering a landing page for an outdoor consulting firm, [Fijordo](https://www.fijordo.com/). This case study offers insights into creating a professional website for consulting firms and the nuances of custom website development.
In this case study, I’d like to share my insights working on this project. There are several parts that would be valuable for those who seek to create a website for their company as well as for designers and developers who seek to understand the process of creating such a website from start to finish.
I’ll cover lead generation, communication with the client, research, concept, and UI design, visual and written content creation, and the unique solutions of this project.
## Lead generation
A long-time client, familiar with my expertise in architectural design, approached me for a new project: creating a lead generation-focused website for their newly formed consulting firm.
The client was curious about the value of professional web design services versus creating a DIY website using a drag-and-drop builder like Wix, particularly focusing on the aspects of SEO, user experience, and the professional versus DIY website debate.
Is it really necessary to invest a certain amount of money for their first website or they could just do it by themselves?
We got on a call where we discussed the pros and cons of custom website development versus using a template.
First, I explained to them the value of a website created by a professional. If they build it themselves, the website would serve as a business card that they would send to their potential customers to get some basic info about their services and operations. It would most likely gain no organic traffic because the website wouldn’t be optimized to rank. Why? Limited knowledge of SEO in both the technical side of things and content-wise.
My first argument was that I could provide value by generating leads through their online presence. It was something they really needed as it was a new company and they didn’t have a flow of clients to sustain their business. The solution involved a strategic focus on SEO and content optimization, aligning with users' search intent to enhance online visibility and organic traffic. The second part of the solution was to create a blog to target a much broader range of keywords and create an authority in their niche. Optimizing a landing page for search is a good start, but unfortunately, it’s not enough to outrank their existing competitors.
The second argument explained the difference in perception between a website built with a template and a designed one. When you build a website using a template with little to no experience in storytelling, design, and marketing, it just looks like any other cheap DIY solution.
What’s the problem with that? Being a new company, they would be naturally compared to other competitors that have similar or better websites. Given the track record and experience of older companies, they would have no chance to be valued more than their competitors and they would lose potential leads.
A unique website gives them a chance to be valued higher among competitors. Given the nature of their services, which is consulting people on how they can use their land to create a profitable venture, a unique website gives them a hint on how they operate internally. If a bespoke tailoring shop looks like an average clothing store, then the storefront gives an impression that perhaps their work has no more value than the usual clothing store they go to. If the work of the shop is displayed in a particular way where the lights are set correctly, the design displays their product in the best way and everything tells that here you can find a unique solution to your problem, then it leaves a totally different impression on a potential client.
It’s important to note that I do not value the design of the “space” that showcases their product over their product. I think the product and the service are the most practical things for the client. The proper showcase helps the user understand if this service provider can help them to solve their problem.
These two arguments, lead generation, and user experience, persuaded the client to use my services to deliver their website from start to finish.
## Research and analysis
A few years ago I learned about the concept of first principles and it resonated with me. Essentially, first principles are bits of information close to the truth for a given problem. First principles help you to remove assumptions and base your decisions and actions on truth rather than your current worldview, experience, and beliefs.
In my work and life, whenever there’s a question to answer, I examine it to find the truth about it. Whether it is a web design or a start-up, there are always questions that one must answer in order to understand the given problem(s). When there’s understanding, the solution comes naturally.
In the case of Fijordo, I had to understand the nature of the company and the services, what makes them unique, and what value they provide. To find the truth (or something close to it), I prepared a questionnaire tailored to this project and sent it to the client. When I received their answers, the picture in my mind of what this project was about became clearer. A certain vision of the website started to form.
## Concept
In every design work, I am looking for a concept that defines the project. An idea that weaves different parts of the work together and creates the foundation for it.
When I received the answers from the client, I found one part of their services interesting. What makes Fijordo unique, they said, is that in every project they not only focus on profitability but also on the integration with nature. This unique feature became the foundation of the website concept. I wanted it to be reflected in the design and experience.
To reflect the nature of sustainability in the projects, I created a set of conceptual images that show how Fijordo integrates with different landscapes and scenery. The loading animation and the header became the unique feature of the website that speaks to the concept of the business and creates a memorable impression for the users.
The artistic concept is one part of the solution. The second part is defining the structure that tells a certain story. In this case, it tells the story of the company, its services, and the people behind it. Since the website is not an entertaining type of medium, the structure had to be aligned with the main goal: explain the service and convince them they are a good fit with the customer.
Once the concept was defined, everything else aligned with it: the text, the images, and the UI design.
## Content
One of the most important parts of a landing page project is the content. The user visits the page for the content to find answers to their problem.
Upon reviewing the AI-generated content provided by the client, I realized the need for a more nuanced approach to integrate AI in web design and content creation. It was verbose, exaggerated, corporate, and not focused enough on the value they create and the problems they solve.
It was not going to help to create leads. Instead of using the text as it was, I took the answers from the questionnaire and started to generate the texts by myself with ChatGPT focusing on the goals defined in the concept phase and optimizing it for keyword search intent.
It was a trial and error until I found a way to make the AI sound less corporate and exaggerated.
It’s fascinating that as a creator, I can use ChatGPT as my assistant to generate content that is aligned with my vision of the website. I think given a budget and resources, a human copyrighter could create better content that has a unique voice and wording, but in the case of Fijordo, the budget was limited and the outcome exceeded my expectations.
Another fascinating part of the content creation was using Midjourney and Stable Diffusion to generate visuals. Without it, I’d have to go through stock images and find the right images for different sections of the website. Now I can prompt to generate images that I have in my head. Since my client had a limited budget for visual content, AI image generation became a valuable tool for creating appealing images while staying within the budget.
It’s like having an assistant who can create different kinds of images in any style to fit the design and the concept of the website. In some cases, I had to edit the images but most of them were left untouched.
Having the possibility to use generative AI in the design work is incredible. It makes you a project director, a generalist, who can manage all parts of the project by himself and cut the costs for the design and development.
## Development
A key highlight of this project was the technical intricacies of form submission in the Webflow development process, showcasing the integration of Formspark and hCaptcha.
The native Webflow forms use Google’s reCaptcha to filter spam and it is not reliable. For this project, I decided to use a different solution.
I used Formspark to manage submissions and hCaptcha to filter spam. It was a bit of a challenge to integrate these tools together with custom code but the result came out really well. You can read more about forms in Webflow in [this blog post](https://www.maray.ai/posts/webflow-forms).
Both tools provide a free tier with a limited number of submissions, so it came with no cost for my client. When they scale and get more traffic, they can easily upgrade to a paid plan, which is quite generous compared to other form submission providers.
Other than that, this build sports subtle interactions and animations built with GSAP and custom code. Additionally, the website is built with client-first class naming framework. I submitted this project to be reviewed by Harshit from Finsweet and except for a few minor things, he evaluated it very well. You can watch the review at [the beginning of this video](https://www.youtube.com/watch?v=idPzcbkwW9Y).
## Final thoughts
This consulting firm website project ranks among my favorites. It was a comprehensive journey that enhanced my understanding of web design and development, especially in the context of integrating nature into web design.
I hope these insights prove valuable. For those interested in collaborating or seeking web design and development services, feel free to reach out.
