template

Perfect pitch
presentation
template

A T E M P L AT E B R O U G H T TO YO U B Y
Your Logo
Project description
Client Name
Date
Web design presentation

Contents

1. Project overview
2. Project features
3. Proposed website structure
4. Mood-board
5. Web development process
6. Project time-line
7. Pricing
8. Contact details
Web design presentation

1
Project overview

This presentation should be presented after an initial

conversation and briefing has taken place. With this
presentation a more accurate scope of the project can
be presented to the client.

This page should include a brief description of

the project, the scope and main features. Type of
technologies used and general design ideas. This
description contains top line information that’s vague
and can be amended as the project develops in its first
stages.

A few aspects to take in to

account are the following:

Number of pages
Is the website responsive?
Does the site need e-commerce capabilities?
Does the site need SEO?
What extra features does the site need?
Does the site need marketing?
Web design presentation

2
Project Features

Make sure your client understands the scope of the

project. This is your chance to talk about included
features and optional features that fall outside the
initial budget. Make sure your client knows if they are
getting a multilingual site, SEO, marketing and other
features included or excluded of the initial budget in
order to prevent later misunderstandings. Here are a
few examples of what your a site might include.
Web design presentation

2
Project Features

Included features Optional features

• Fully branded website Hosting
• Custom built, pixel perfect graphics
• Web fonts • Unlimited storage space*
• Social network connectivity • Unlimited email accounts*
• Automatic backups • Web mail and mobile ready email
• Web security • Personal email setup
• Content management system • SEO Optimized
• Content management system training • Online website backup
• Responsive design
• Browser optimization Maintenance
• Blog functionality
• Interactive layouts • Personalized assistance
• Animated buttons • Updates to blog
• Multilingual site • Design updates
• Updates to case studies
Web design presentation

3
Proposed website structure

Chances are that your client doesn’t know what they

really want in their website. With this simple structure
Case studies

it will be easier for you to portray an idea of the content

About
they should include in the website and steer them
away from unnecessary pages and overcomplicated
structures. This map starts the conversation with the
Blog
client and allows future amends to be done. Home
Contact

Login

Register
Web design presentation

4
Mood-Board

After talking to your client and getting a general feel

for what the site is about and the target market, you
Futuristic

Fresh

should have a general idea of what the website could

Image Driven
look like. A mood-board is extremely powerful, it gives
huge creative direction to the project and narrows
design possibilities. Mood-boards portray key aspects
such as colors, tone of voice, design tendencies and
web layouts that can minimize your design time and
steer clients in the right direction. This mood-board can
include: key words, colors, images, inspiring design and
anything that can communicate the design direction to
the client in a short an succinct way.

Inspirational Energetic
Web design presentation

5
The web
development process
With this simple structure you can make sure that
you and your client understand the stages required to
complete a successful web project. One of the most
important steps often overseen in web development
is the content generation stage, it should be clear if
this is expected to be delivered by the client or not.
Each step is a checkpoint that requires client sign off
and prevents last minute overhauls that ruin initial
estimates. Some steps may be skipped, may overlap
others and additional steps can be added to the chart
to suit a particular project.
Web design presentation

5
The web
development process

1. Research 4. Design
1.1 Client research 4.1 Creative direction
1.2 Website research 4.2 User interface design
1.3 Industry research
1.4 User research 5. Development
5.1 Development
2. Content 5.2 Proof build
2.1 Content audit 5.3 Content population
2.1.1 Copy
2.1.2 Images 6. Testing & delivery
6.1 Testing
3. Planning 6.2 Delivery
3.1 Information architecture & user
experience 7. Maintenance
3.2 Website wire frames
Web design presentation

6
Project time-line

Let the customer know what to expect

in each stage and how long it will take to 3rd stage: Planning
complete
(Estimated delivery time in weeks)
Wire-frames and information architecture are crucial
1st stage: Research to completing a user friendly website. Planning goes
hand in hand with the design, these two stages can
(Estimated delivery time in weeks) be completed simultaneously if required. Wire-frames,
This stage is crucial in order to develop an site-maps and initial user interface mock-ups are
understanding of the design direction, main objectives completed.
of the website, target market and competitors. The final
product will be determined and a clear idea of the web-
site’s function and capabilities.

2nd stage: Content

(Estimated delivery time in weeks)
All content is gathered at this stage. These assets will
form the web-site’s structure and will prevent missing
deadlines.
Web design presentation

6
Project time-line

4th stage: Design 6th stage: Testing & delivery

(Estimated delivery time in weeks) (Estimated delivery time in weeks)
This stage dives into graphic proposals. After choosing The website is subjected to thorough testing in different
a route that suits both the client and the websites web browsers by the programmer, the end client and
objectives nonfunctional images are presented to individual users. Final corrections are done and all
the client to represent an overall look and feel of the relevant files are handed to the client.
website. Depending on the project’s terms, a mock-up
for every single page might be required.
7th stage: Maintenance
5th stage: Development (Ongoing)
If the client requires maintenance to the website the
(Estimated delivery time in weeks) terms should be stated. Maintenance might include
This stage shouldn’t be started before all previous steps updating the news feed, website backups, hosting,
have been completed. This part involves the creation of updating images and reviewing the web-site’s content
all the web material in a functional state. Animations, periodically.
galleries, plug-ins, fluid layouts and different assets are
implemented of created.
Web design presentation

7
Pricing

After the stages have been clearly established, it’s easier

to create a table with the time each one of them will
take. This is an initial budget and should be regarded
as such. It’s important to let the client know that
these times can change depending on the scale of the
project.

It’s important to specify what features will be included

and state the price for additional services or features
such as maintenance, hosting, domains, themes and
plug-ins.

If the project is completed by an hourly wage this

should be stated.
Web design presentation

7
Pricing

Initial website quote Additional costs

Please note that this is an initial budget and prices are Hosting
subject to change (Monthly amount)
(Yearly amount)
Domain
Research (Time in hours) Plug-ins
Theme
Planning (Time in hours)
Design (Time in hours)

Development (Time in hours)

Testing & Delivery (Time in hours)

Total Price £ (Total amount)

Deposit (If a deposit is

required this is your
opportunity to state it)
Contact details
Name:
Email:
Telephone:
Skype:
 Thank you for reading this template

If you’d like to see more material made specifically for digital

design nomads we have assets, courses and the latest news
from the nomadic world on our website:

www.startloaded.com

Feel free to share this template, you can also find us on the
following platforms:

hello@startloaded.com