Clikzy Creative Design Process

1. 108 North Payne Street
Alexandria, VA
703-567-4330
contact@clikzy.com
OUR
DESIGN
PROCESS

2. 1 WIREFRAME
After the discovery and planning phase of any
project, including a thorough website question-
naire and kick-off call, the first step is creating a
homepage wireframe.
A wireframe is the skeleton of your site. By
building a rough outline of your site (black and
white, no graphics) we ensure that every piece
is in place. It’s not pretty, but it gets the job
done. This bare-bones layout reveals the struc-
ture of the site without distracting stylistic treat-
ments. At this point, if there are any content
changes, they can easily be made without dis-
rupting the design.

3. 2 MOCKUP
DESIGNS
After the wireframe has been approved, we
move on to the exciting part - design!
This is the point where our designers wave their
magic wands/mouses and transform your rough
site plan into a real design. We summon all our
Photoshop/Illustrator talent and design know-
how to create a website that not only works, but
wows.
We start with the homepage, as this will be the
driving force in the overrall design and site aes-
thetic. Once the homepage is crisp and hand-
some, we design out the unique internal pages.

4. 3 REVISIONS
(unlimited)
We want you to love your website. Even if that
means you have a specific idea and aesthetic in
mind and you realize that perhaps it’s not ex-
actly what you were hoping for. That’s why we’re
here.
The feedback you provide drives the design pro-
cess. Before we develop your site, we make sure
that every detail has been approved. We’re flex-
ible so you don’t have to be.
*For example, for Crawford PR, our client Jim had a very
specific plan in mind for the homepage design of his new
site - which you saw on the previous slide. However, it
didn’t sit well with him once he saw it come to life. So we
showed him our ideas and designed a page that was
unique, professional, and modern in its ability to em-
brace whitespace and allow the user to breathe by using
large typeface and engage them through interactive
hover elements (namely, the black and white images
become full color once hovered over). By working as a
team, we are able to create the most successful design.

5. EXAMPLE
CRAWFORD PR
Overall design elements:
• Plenty of whitespace: Whitespace is key to improving
user experience. Giving the user visual breathing
room allows them to better digest the content and
navigate through the site intuitively by providing ob-
vious focal points versus a pile of information that is
crammed into too small of a space and forces their
attentions elsewhere.
• Hover effect: Adding any sort of interactive element
to a site will allow the user to tangibly engage with
your product, which will make you that much more
memorable. You are subconsciously telling your audi-
ence “hey, if you take the time to interact with me
you will not go unheard.” Watch - let your users make
your black and white photos turn into color and you’ll
see them light up (figuratively speaking).
• Large type and imagery: The modern trend of large
type and high quality images is more than just looks -
it serves a purpose. Large text improves readability
and custom, beautiful photographs captivate your
audience.
• Calls to Action: Ultimately, you want your website to
be a tool for your user - whether it’s purpose it to
inform, persuade, or act. Having clear calls-to-action
allows your audience to intuitively navigate through
your site, getting to the area they need to be and dis-
covering new information they didn’t even know they
needed...until now.

10. EXAMPLE
SALLY HERSHBERGER
Overall design elements:
• Interactive Elements: For Sally H, we incorporated a
good amount of interactive elements, mostly through
hover effects. We used large, high quality images as
calls-to-action to internal pages, and a frosted/ trans-
lucent effect when a user hovers over an image that
leads to an internal page. We also used an interactive
sorting option on the Individual Salon pages, which
allows the user to sort through the stylists via differ-
ent criteria. These elements add a personable touch
to a site that promotes a prominent celebrity and
staple stylist and product line in today’s hair and
fashion industry.
• High Quality, Custom Images: We had the opportu-
nity to work with high quality and custom images
with Sally H, so we certainly capitalized on it. Custom
images can be the difference between a mediocre
site and an amazing site. Imagery is significantly im-
pactful on an audience, even more than they realize.
For instance, you may hear people often say they love
the Apple website. However, if you remove all of the
great product images from the site and replace them
with stock photography, the website will have a very
different effect.
• Sharp Colors & Subtle Textures: We made sure the
new Sally H website exerted a modern, elegant, yet
edgey persona through the use of sharp and crisp
black and white - and spots of pink for variation. We
also used subtle textures to add an element of inter-
est. The details truly make the design.