How to design from a blank canvas

Default avatar.
February 28, 2013
How to design from a blank canvas.

ThumbnailMost web design and/​or development projects have some history behind them. Sometimes you have to re-design or re-develop a company’s existing website to update it and add new functionality. In most cases, there is some history to the website; its business goals have been identified, research has been carried out, and you are able to look back on historical data such as analytics to aid in making decisions throughout the design and development process. You’re able to identify the improvements that need to be made.

But what happens in the rare case that client company has no website? They have never even thought about having a website in the past. This is totally new territory to them — they’ve got a totally blank canvas.

This isn’t the usual project that I come across, but having been in this exact position recently, I’d like to share some of the steps I took to complete the project and some of the things that I learned along the way.

Initial questions

Before starting any project, I like to ask the client a few simple questions. Whilst some of the questions below are specific to this client, some of them are ones I ask all clients before I agreeing to take on a project.

  1. Why do you want a website now, having not had one before?
  2. What do you want the website to do or achieve?
  3. Do you have a budget?
  4. Do you have any competition online?
  5. How easy is it to talk to your existing customers?
  6. Do you think your existing customers would mind answering a few simple questions?

Before taking on any new project, I want to make sure that I can get along with the client. I have been in projects in the past in which the relationship has deteriorated — it’s not pretty.

The answers to all of these questions were good. The budget was not massive, but I felt the project was achievable with it. I was going to take a quick approach to the entire project. I did not want to dwell on each part for too long. I wanted to see if it was possible to complete the project quickly whilst satisfying all of the objectives.

Not having any historical data info to help me, I decided to do what I call quick and dirty research”. Often you can spend longer on stakeholder interviews and market research than you do on actually coding a website. I decided this project would was going to be different.

Identify the business’ goals

Often clients have a good idea of why they want a website and what they want it to achieve. When a client answers the question of why they want a website with our competitors have one” alarm bells start ringing. Luckily, this client of mine had already realizsed that in order for their business to grow, they could only sell to so many customers over the phone. They could not afford to take on more sales staff, but they did have a budget to build a website as a sales channel. They had two business goals for the website:

  1. increase sales;
  2. reduce their brochure printing costs and eventually eliminate the need for a brochure altogether.

The client having already identified these goals was a great start. After discussing it with them a little further, we decided to add increasing brand awareness” as another business goal for the website.

Competitor research

The chance of being the only website on the internet offering a particular product is very rare. Unfortunately this client did have competition online. I wanted to assess their strengths and weaknesses.

I approached this in two ways. The first, was that I asked the client for a list of their competitors. The second, was that I did my own searching online, looking for the products that the client sells. This highlighted a few other competitors that which the client was not aware of.

I assessed each competitor based on the following criteria:

  • How functional was their website?
  • Was it a brochure or a full e‑commerce site?
  • How usable was the website?
  • How did the websites look and feel?

Armed with this information about the competitors, I was able to make recommendations and decisions about what the new website should look like and what it should do. I was able to identify weaknesses that I wanted to make sure the new website did not suffer from. I also identified some strengths that which gave me some inspiration for the new website.

Research existing customers

I realized early on that I was going to have to talk to the client’s existing customers, which is why I asked that initial question about whether this would be okay.

I asked the client for the contact details for a small number of their customers who the client did not think would mind my asking them a few short questions. By asking them a few brief questions I wanted to figure out what they would find useful on the new site. It is common sense that keeping your existing customers happy, will not only mean that they place repeat orders, but that they will recommend the client to others.

The main question I asked was, How could the website make ordering easier for you?”. The general consensus from all the customers that I spoke with was that they would like the ability to place repeat orders easily. They currently had to call up the client every time they wanted to order and tell them what they wanted to order.

Carrying out this research took less than an hour. It may not have been as pure or as scientific as some people would have liked but it highlighted a major feature that the new website should have.

Design, build and testing

So far, the research yielded some really great insights and inspiration for the new website, and it had taken a matter of days, not weeks.

The client already had a good idea of what they wanted the website to look like because they already had a strong brand identity for their business. I spent a day at their offices. We discussed the results of the research, had some lunch and did some rough wireframes until we were both happy.

By lunchtime the next day, I had made some full-color mockups of the wireframes, and the client had given me the go-ahead to start building the website. I only gave them three options. I didn’t want them to spend too long deciding because that would eat into the budget.

Building the website was straightforward. There was nothing functionality-wise that was too complex. It was an e‑commerce website, so I opted to use a pre-built cart. There is no point in re-inventing the wheel.

Instead of building the entire website, and then testing it at the end, I decided to test it as it was being developed; as each stage was completed. This would reveal any issues, which could be quickly rectified before moving on to the next section. Some things were missed, but all the major issues were caught. The missed issues would be dealt with later. Given the budget, there was no time for a real user testing session, so I decided to do some quick and dirty” user testing. As each stage of the website was completed on a development server, such as the shopping cart, the check-out area and the area for the registered users, I would ask everyone in the client’s office to use the website on a development server. As they were close to the project, I wanted to get some outsiders to test it, so I asked my family. I even asked a few randoms in the local coffee shop. I was surprised at how friendly they were.

The website launch followed the usual process. I made sure that all the analytics software was up and running. No longer was the project a blank canvas.


From the initial client meeting to the live website, took a massive three weeks. I have had design approval take longer than that on other some projects I’ve worked on.

I learned a few things along the way, whilst working on this project.

Carrying out a project, whether it’s creating a totally new website or updating an existing one, in a short space of time without having to sacrifice one’s goals is possible. Research does not need to take a long time or cost a fortune. Yes, you will miss a few bugs in testing, but the beauty of the internet is that you can quickly make changes to the code and everyone will see those improvements instantly. It’s not set in stone.

Some purists might not approve of some of my methods, and they probably would not have taken on the project because the budget was not big enough for them. Would they have been able to make a better website?. I’m not so sure. Orders are coming in, and my client is happy. The website is satisfying all of the goals that were identified, and it took weeks, not months.

I think sometimes designers and developers can sometimes get caught up in the details. But whilst the beauty of the medium we work in is that a website can be easily changed. Build it, ship it, and iterate to improve it.

Do you prefer working from a blank canvas? How do you go about developing a strategy? Let us know in the comments.

Featured image/​thumbnail, blank page image via Shutterstock.

Sebastian Green

Sebastian Green works at a small web startup within an established IT Support Business in Manchester. His passion is using the latest technologies to aid business growth & automate boring procedures.

Read Next

15 Best New Fonts, May 2023

The choices you make when selecting a typeface have more impact on your design than almost any other decision, so it’s …

10+ Best Tools & Resources for Web Designers and Agencies (2023 updated)

Having the ability to envision a tastefully designed website (i.e., the role creativity plays) is important. But being …

20 Best New Websites, May 2023

This month, there are tons of great new agency websites to get excited about. 3D animated prisms are a popular theme, a…

How to Find the Right White Label Website Builder for Your Agency

Web design agencies face a lot of obstacles in closing the deal with new clients. One of the most common ones is the ar…

Exciting New Tools For Designers, May 2023

There are hundreds of new tools for designers and developers released each month. We sift through them all to bring you…

3 Essential Design Trends, May 2023

All three of the website design trends here mimic something bigger going on in the tech space, from a desire to have mo…

10 Best AI Tools for Web Designers (2023)

It’s time to stop worrying if AI is going to take your job and instead start using AI to expand the services you can of…

10 Best Marketing Agency Websites (Examples, Inspo, and Templates!)

Marketers are skilled in developing strategies, producing visual assets, writing text with high impact, and optimizing …

15 Best New Fonts, April 2023

Fonts are a designer’s best friend. They add personality to our designs and enable fine typography to elevate the quali…

20 Best New Websites, April 2023

In April’s edition, there’s a whole heap of large-scale, and even full-screen, video. Drone footage is back with a veng…

Exciting New Tools For Designers, April 2023

The AI revolution is having a huge impact on the types of products that are hitting the market, with almost every app b…

3 Essential Design Trends, March 2023

One thing that we often think about design trends is that they are probably good to make a list. That’s not always true…