A website’s art direction: how does the design phase work?
Moodboard, mock-ups, design system, approval: how a website’s design phase unfolds, what’s expected of you and how to get it right.
By Léo Chuzel · Published on · 2 min read
Between the first meeting and the development of your website, there’s a decisive stage: art direction and design. That’s where the mood, structure and look of every page are defined. Understanding it well lets you take part effectively, and avoid endless back-and-forth.
What art direction is meant to do
Art direction translates your positioning into visual choices: a mood, typefaces, colours, a style of photos and illustrations, a layout rhythm. It ensures that the whole website, and beyond that all your materials, speaks with one voice. It’s not a matter of personal taste: every choice must serve your image and your goals.
The steps, one by one
1. The brief
Your goals, your customers, your competitors, what you like and what you hate, your constraints (existing identity, available content). The more precise the brief, the faster the rest goes.
2. The moodboard
An inspiration board that sets the mood: images, typefaces, colours, website references. It’s the time to approve the general direction before investing time in mock-ups.
3. Architecture and wireframes
The pages and their content, as black-and-white diagrams. You approve what each page says and in what order, without being distracted by visuals. It’s the most important stage for conversion and SEO.
4. Visual mock-ups
The homepage first, then the key page templates, on mobile and desktop. The mock-ups are interactive: you click through them like a real website.
5. The design system
Colours, typefaces, buttons, cards, forms, spacing: a component library that keeps the website consistent and speeds up every future change.
How to give good feedback
- Start from your goals rather than your tastes: “will my customers understand?” rather than “I don’t like the green”.
- Group your feedback in one go, with a single final decision-maker.
- Test on your phone: that’s where most of your customers will see the website.
- Ask questions: a good designer explains their choices.
Design and development: working together
Many projects fail because design and development are done by teams that don’t talk to each other: superb mock-ups that are impossible to build, or a slow website because of poorly thought-out visual effects. With us, the design is created with Artcadia, our partner studio for over ten years, and we’re involved from the first mock-ups to guarantee performance and SEO. You have a single point of contact, and the final website looks like the mock-ups.
How long does it take?
For a showcase website, the design phase generally takes two to four weeks, depending on how quickly approvals come in. For an online store, an application or if a visual identity needs to be created, allow more.
To go further, read why design influences your sales and when to update your visual identity. And discover our UX/UI design and visual identity services.