The Process of Designing Your Website (with Case Study)

by | Apr 17, 2023 | Website

Every designer has different processes, and processes vary for different custom web design projects. Sometimes, these processes can be confusing, whether or not you engage a web designer. Thus we have written this post, using a chart to help you visualise the general steps taken to make your website live. Do note that these steps are usually non-linear and, especially in bigger projects, may require further revisions to enhance the website.

Part 1: Custom Web Design Process

Stage 1: Gathering of Information

First and foremost, it is important to understand your target audience, the purpose(s) of them visiting your website, and the overall objectives of your website. If you have no idea where to begin, you may wish to start by looking at some of the marketing done by your competitors, paying particular attention to their websites (if any).

Stage 2: Concept and Planning

The information gathered at the initial stage helps to direct the story flow and user experience. Content such as images and write-ups play a great role in user experience, and communicate your brand values and message to your visitors/customers.

Stage 3: Mockup

A mockup (by a website designer) is usually done to help clients visualise how the website will look and what the user experience feels like before the website’s development. This step ensures that future amendments are minimised. However, if you’re designing on your own, a mockup is usually not necessary.

Stage 4: Development and Testing

Usually, the website designer will develop the site on a ‘staging site’ (test site) after the client’s approval, where functionality-related features such as buttons and links are created and then tested before pushing the site live, where said features are tested again. As mentioned, if you’re designing on your own, a test site is usually omitted in favour of the actual live site.

Stage 5: Site is Live

Your site will be made live after the initial testing on the staging site. Visitors can now visit and access your chosen domain, eg.

Stage 6: Continuous Feedback & Maintenance

As your website continues to run, it is vital to update the company’s latest news and information to your visitors. Be sure to monitor the website’s uptime, and maintain it with the the latest backend updates to ensure that it performs well.

Depending on the objectives, scale and complexity of the custom web design projects, some projects carry out the UX process whereby the user experience is revised after the first version of website is launched.

Plan for your marketing activities to have more digital visibility or redirect visitors to your website. As your users’ demands, industry trends, and competition change and evolve, you may wish to add on features/functions or revamp your website to be more relevant to your target audience.

Part 2: Case Study

Let us demo the custom web design process through a case study.

The client is looking to build a custom website for her air-conditioning business to enhance her company’s digital marketing profile, with the aim of generating leads and increasing sales.

After understanding their objectives and requirements, Wild Clover Digital proposed a landing page that has information about the company, services, and their portfolio – with a clear call to action – to WhatsApp them and find out more.

Step 1 and 2: Gathering of Information and Concept and Planning

The initial stage involves gathering the necessary details. Our team first met the client to understand her company’s values, beliefs, work processes, and services. We also obtained images and details from her and clarified some of the industry terms. The accuracy and arrangement of content – which includes said images and write-ups (‘copy’) – are crucial in portraying her brand’s story.

As the business is in air-conditioning and the client is Mandarin-speaking, we experienced some difficulty when translating industry jargon. However, we overcame it by researching other air-conditioning websites. We also spoke to various users to find out what they feel is important when searching for an air-conditioning company.

Gathering of information and concept-planning may seem like a tedious process but they set a strong foundation for your website’s development and help enhance your current or future marketing/branding activities. The research and information also allow us to convey the company’s branding and story, as well as plan for a seamless user experience (for the website’s visitors).

Step 3: Mockup of the Website

Next, we move on to the mock up.

A draft design mockup was done after the initial copy was completed. Rearranging of items and revisions were made to fine-tune the overall look of the site that will best represent the brand. The draft design is presented to showcase the website and general user experience.

In the midst of designing the website, the client requested for some adjustments which were gladly acceded to; certain design options were excluded from the final product as it did not align with the company’s branding.

Step 4: Developing and Testing of the Website

Several platforms/sites are user- and design-friendly. After obtaining the client’s approval of the mockup, we developed the site on WordPress and ran initial tests before launching it live. We decided to undertake this project with the help of WordPress due to its scalability and flexibility, allowing the client’s future marketing activities to be more easily implemented and effective.

Step 5: Site is Live

Well, how did it turn out? Presented here is the live site of the aforementioned project. It contains several videos and a selection of the best quality photos (from those provided to us) mixed with stock images to create a well-balanced overall aesthetic that is in tune with the company’s branding and image.

What’s Next if This is Your Company’s Website?

  1. Update your website with the latest news and information
  2. Monitor the website’s uptime
  3. Maintain your website with the latest backend updates
  4. Consider enhancing or upgrading your website
    • Plan for your marketing activities to redirect more visitors to your website
    • Add on features and functions to tailor to your user demands or industry trends
    • Revamp your website or branding as your business grows

About Wild Clover Digital

We are a web design company that is based in Singapore and we help businesses increase to increase their digital presence. Contact us via the button below for a free consultation.

Read Other Posts