How Much Does It Cost to Design a Website?

157 Views
|
22 Sep 2020
|
12 min
author avatar
Maria D.
Business Analyst
author avatar
Elizaveta S.
UI/UX designer

What’s the cost of professional web design? Well, the prices range from $1000 to $100,000 and more.

That’s because website design cost, as the cost of any digital product, is a tricky thing. No designer can tell you the exact sum until they know your requirements. This includes the number of web pages, features, whether you’re redesigning an old website or making one from scratch, and so on.

Besides, website design isn’t the best thing to save money on.

Google confirmed: it takes 0.05 seconds for users to form an opinion about your website. If they don't like how it looks, they leave.

In this guide, we’re explaining how much it costs to create an appealing web design, what factors influence the cost, and what steps UI/UX designers take.

Table of contents

!

Note! Below, we’re providing APPROXIMATE time and cost estimations. To tell you the exact sum/number of hours, we need to get acquainted with your project materials first.

What Impacts the Cost of Website Design?

The general rule of design estimate is: Сost = required working hours × hourly rate

If the team requires 100 hours to do the job and they charge $50 per hour, it’s 100h × $50 per hour = $5,000.

How to calculate web design cost?

Formula to calculate the cost of website design

Now, where do these costs come from? Usually, website design costs depend on:

  • Website complexity (custom elements, graphics, animation)
  • Whether you need to adapt for mobile users
  • Who does the job—a ready-made template, freelancer, or a company
  • Region where you hire designers

Before we review these factors, there’s one thing to note: clear project requirements reduce the time designers spend studying your product. Hence, reduce the cost.

So if you have any materials (list of websites features, number of pages, a brand book) or documentation ready, share it with your team.

Now, let’s see what professional website design costs are made of.

1. Complexity

Of course, it’s faster and cheaper to make a landing page than design corporate or e-commerce websites like Amazon or eBay.

The fewer unique pages a website has, the fewer time designers spend studying the target audience, analyzing competitors, and designing the website itself.

But even if you're making a landing page, it can be of different complexity. For example, here's a simple page designed by Shopify: no animations, not too many elements.

Example of a simple landing page, Shopify

A simple landing page made by Shopify

If a designer has all the content and doesn't need to draw anything, 6-8 hours will be quite enough to create a similar page. In case they need to work with illustrations or draw content for mockups, it can take 16-20 hours.

  • 6-8 hours = ~$300-$400
  • 16-20 hours = ~$800-$1,000
!

Note! We're using a $50/h rate here and below as it's an average cost of web design services in our region (Eastern Europe). The hourly rate may be different in your region.

Let’s see another example. Here’s Apple's Mac Pro landing page, which has complex 3D animation and lots of elements. This page may take ~700h of work. And the cost of designing a website like this one goes up to $35,000-$105,000 (depending on the vendor rates.)

!

We have an extensive guide on software development rates in popular tech hubs around the world.

Example pof a complex landing page animation

One of the animations on the Apple’s landing page

When working on a landing page, Cleveroad designers prepare 2 or 3 versions of a page. It’s called a visual concept. Clients choose the one they like most, then we make a full-fledged web page design. This process takes approximately 16-20 hours.

We evaluate web design costs either by features or screen/page complexity:

  • Simple (text, a couple of buttons) takes 2-4 hours to design ($50-$200)
  • Medium (authorization, maps) — 4-8 hours ($200-$400)
  • Complex (animation, lots of elements) — 8-12 hours per screen ($400-$600)

2. Responsiveness

Most likely, you want the website to look good on mobile devices.

If not, consider this:

  • In 2021, 72.9% of all purchases will be done from smartphones
  • Mobile accounts for approximately half of the web traffic worldwide
  • Google loves responsive websites and ranks them higher

In responsive design, the website’s layout is shrinking or expanding according to users’ display width. As the user switches from their PC to iPad or a smartphone, the website automatically switches to accommodate resolution and image size.

It makes web pages render well on different devices—laptops, tablets, smartphones, so there’s no need to create a separate mobile version.

How responsive web design works

Responsive design accommodates to users’ device screen

Responsive website design can be roughly estimated as ~40% of the web design time.

For example, it takes 168h ($8,400) to design a Netflix-like website and 48h ($2,400) to make this design responsive. In total, a responsive Netflix-like website design costs ~$10,800.

3. Vendor

The cost of website design also depends on who will be working:

  • Ready-made template
  • Freelancer
  • Agency

Let’s review these options in detail.

Use an out-of-box template

If you're making a simple website not connected with business, template-based design may actually work. And it’s surely the most budget-friendly option of all.

Sites like WordPress, Wix, or Tilda let you create and manage your website for using minimal resources. They are often free-to-start but offer additional services like paid themes, add-ons, or icons.

It’s very likely lots of other website owners use the same template. Besides, such websites don’t have the flexibility a business needs: there's limited customization, hidden security issues, they're often not responsive.

Even if you want to create something more sophisticated on WordPress, for example, you have to pay for a business or personal website theme. The cost is between $1,500–$5,000.

Hire a freelancer

If you want a custom design for the website, the next option is working with a freelancer. Hiring a freelance website designer costs less compared to an agency. The point is—you should know precisely what you want:

  • What features the product will include
  • Who are your users and how they use websites
  • How many pages you need

It's up to you, not the freelancer, to make design decisions and control the process.

Hiring a freelance designer may work for simple websites or landing pages. But if you need a more complex product, freelancers aren't the best choice as they give you no guarantees and may quit the project anytime.

Work with an agency

The only bad side is probably the costs—they often depend on the company’s level. The more experienced designers they have, the more they charge.

Still, if it's too expensive to work with the US or UK-based company, you can always outsource UI/UX design services. I'm listing the average cost of web design in the next section.

As for the benefits of working with an agency:

  • They sign a contract and take responsibility for their actions
  • There's a full team working on your product, including Business Analysts, a Project Manager, and developers
  • You may need a graphic designer to be partially engaged in the product

4. Labor costs

Vendors' costs vary depending on the region. That's because of the competitive salaries they need to pay, office rent costs, taxes.

It’s much cheaper to run a company in Eastern Europe than in the United States or Western Europe. The average cost to create a website in the US is twice as much as in Poland or Ukraine, that’s why outsourcing is such a popular option.

Here’s how much UI/UX designers charge per hour in different regions:

Website design costs per hour (Source: Clutch)
Team Member United States Latin America Eastern Europe Asia

UI/UX Designer

$79 - $163

$40 - $50

$35 - $56

$25 - $36

Website Design Cost Components

Each software development company has its own approach to UI/UX design. Below, we're explaining how we design websites at Cleveroad and listing an approximate cost of each stage.

Step #1. Discovery Phase

  • Team: UX/UI designer, Business Analyst, Project Manager
  • Duration: 2+ weeks
  • Deliverables: Specification, wireframes, rough & detailed estimate,
  • Cost: depends on the project’s complexity

After the client’s first contact with us, the team makes a list of features and design requirements.

Then, we prepare a rough estimate with the number of hours they require to design the website. They estimate each web page using two numbers—min and max time.

Estimation of website design cost

Example of a professional website design cost estimation (page 4)

If the client agrees, we estimate how much time and money the planning phase will take and start the discovery phase.

!

This article focuses on the design part. If you want to learn more about our discovery phase, check this guide.

The discovery phase is all about collecting and organizing project information. The team is looking at your product from the customers' point of view and asking questions like:

  • What are your company goals and mission?
  • Who are your competitors?
  • How does the business get revenue?
  • Who is your target audience?
  • What do your users expect from the product?
  • What are the users’ problems the website should solve?
  • What are the required features?

Discovery phase takes place before product development itself. There are three steps:

  • Creating a project specification (a document with tech, functional, and usability requirements, user stories, mind map)
  • Designing wireframes (a schematic placement of elements on app screens)
  • Creating a clickable prototype based on the wireframes (per client’s request)
How web design wireframes look like

Website wireframes example

With ready wireframes, we clearly understand the product’s structure and navigation.

Sometimes our designers work on wireframes while the specification is being written. That's because some ideas may sound good but don't look as good in the product's design. Wireframes help us to see that and correct the part at an early stage.

Step #2. Design Concept

  • Team: UI/UX designer, Project Manager
  • Duration: 16-20 hours
  • Deliverables: Finalized UI concept
  • Cost range: $800-$1,000

We work on concepts after the wireframes are approved, but before page by page designing starts. Designers craft 3 to 5 pages in 2-3 variations different in color and style and wait for the client's feedback.

How design concepts look like

Design concept of an edu website created by Cleveroad

?

Learn more about design concepts and why you need them.

For concept development, there are two scenarios:

  • You have a brand style guide. Designers work on the concept bearing in mind your brand guidelines. They’ll select a color palette, typography, and illustrations based on those guidelines.
  • You don’t have a brand style guide. Designers create a visual style based on the data they got at the research stage (user preferences, competition).

By providing a brand style guide, you reduce the cost to design a website. The team spends less time on research and selecting elements like:

  • The color palette which takes ~3h ($150)
  • Typography typically takes ~4h ($200)
  • Custom illustrations (if required)

Step #3. Visual Design

  • Team: UI/UX designer, Project Manager, web developers
  • Duration: Depends on the number of pages
  • Deliverables: Design ready for development

Next, designers start creating mockups based on the wireframes and the selected concept. It’s one of the most extended steps as we need to prepare each page in different conditions.

For example, it’s not enough to create one authorization screen. We should also design what happens when a user enters incorrect login details, forgets the password, and so on.

If the project is being developed for several platforms (web and mobile apps), we design each separately.

After we're done with the first version of the website design, we approve each screen with the client and make changes per their request.

Educational website design example

The number of pages influences the website design cost

We also create a style guide on this stage if the client doesn't have one. Whether it's a landing page or a large corporate website. It usually takes ~10-12h to create a style guide.

The guide includes all the colors used for elements and different states (errors, hovers, etc.) The same elements can have different shapes, and the typography may also be different (there can be at least 6 headers).

The style guide describes how to properly use all these elements.

Example of a style guide

A style guide excerpt

Finally, as the client approves our work, UI/UX designers handle the project to developers (using Zeplin) and switch to a supporting role.

Step #4. Additional Services

In some cases, our clients ask for additional services like adaptive or responsive web design or adaption to another language.

If there's a need for additional services, they must be agreed at the beginning of the planning stage. And written down in the project's specification.

Then we estimate how much time designers need to deal with, for example, Arabic localization of the website and calculate the total website design cost.

Why Work With Cleveroad

For most of our clients, we design websites and mobile apps from scratch. But we also had a few projects that required a redesign.

The most remarkable was RetailOps, a SaaS retail platform.

In the beginning, RetailOps’ UI/UX design was quite enough for a small application. Over time, the app grew out of its iOS 4 appearance, and the UX could no longer cope with the new scale.

Besides, our clients asked to make the platform accessible for workers with vision issues. We reengineered the app and created a perceivable UI/UX design and used the right contrast color scheme to simplify interactions.

RetailOps application redesign

RetailOps redesign

To see more of our design-related works, check our Dribble page (updated regularly), Behance, or portfolio.

Let’s estimate your design
Describe your project, and our Business Analysts will estimate its cost.

Frequently Asked Questions

Rate this article!
An image
An image
An image
An image
An image
(20 ratings, average: 4.54 out of 5)
Leave a comment
An image
Your message is checked by the moderator and
will add to the site ASAP
Latest articles
typos
Report a typo
Back to top