Hand-drawn website wireframes with image placeholders and lines of text

What web art direction delivers and what it does not

By
Pixelfield Horizon
Articles
Web art direction
Date

Web art direction is one of the more misunderstood services a graphic designer can offer. It is not web design in the full-stack sense, and it is not UI/UX design. It is the visual layer: the decisions about colour, type, image treatment, and grid that determine how a website looks before a developer writes a line of code. This article explains what a Figma handoff from Pixelfield Horizon includes and how to use it.

What is included in the Figma file

The Figma file delivered at the end of a web art direction project contains a colour palette with hex values for all primary and secondary colours, a type scale with sizes and line heights for headings, subheadings, body text, captions, and labels, and a set of annotated components showing how the visual elements combine on a page.

Components typically include a navigation bar, a hero section, a text-and-image block, a card grid, and a footer. Each component is annotated with spacing values, colour references, and type style names so a developer can implement it without guessing.

What is not included

Web art direction does not include HTML, CSS, or any code. It does not include interactive prototypes, user flow diagrams, or accessibility audits. It does not include copywriting or photography.

If your project needs those things, they need to be sourced separately. We can suggest how to brief and find a developer, but the development relationship is between you and the developer.

How to use the handoff with your developer

The Figma file is shared with view access. Your developer can inspect any element to see its exact properties. The annotation layer explains decisions that are not obvious from inspection alone: why a particular spacing value was chosen, how the type scale was derived, which colour combinations are approved for use.

A good handoff reduces the number of questions a developer needs to ask, which saves time and reduces the chance of the visual direction drifting during implementation. The aim is that the developer has few questions once building starts, and that nothing drifts from the visual direction during implementation.

If you are planning a website redesign and want to understand whether web art direction is the right starting point, send a short message with a description of the project. We will give you an honest answer about whether it fits.

#Web art direction #Figma #Design handoff #Japan

See also

Brand, editorial and web design

Home

Studio overview, services and recent articles.

Read more
About

How the studio works

Services, order of work and what we do not do.

Read more
Contact

Send a brief or a question

Registered address, email and an enquiry form.

Read more

Privacy

What personal data this site handles, and how.

Read more

Terms

Terms for this site and for quotations and design work.

Read more