Skip to content
6amDesign
v0.7.0 · PilotUse with AI
6am/Design system/Composition and assets
Section reviewNeeds work1 met · 1 to improve · 1 to review

What is in place, what needs improving, and what still needs a closer look. Each status refers only to the criterion below; it is not approval of the whole section.

  • Meets criterion
    Composition guidance explains hierarchy and the role of imagery.

    The guide includes layout rules and guidance for illustrations and icons.

    View supporting material
  • Needs work
    Common business materials have reusable templates.

    Add editable presentation, proposal and document templates using the shared rules.

  • Awaiting review
    People can understand the message and next step at a glance.

    Review representative layouts with realistic copy at their actual reading size.

Image direction / Composition

Every piece should guide a conversation.

Identity comes through in how you organize the message, choose an image and show the next step. Start with the content and format.

Hierarchy example

One message
that comes first.

The explanation adds context and helps the person decide.

Next step

Composition diagram without photography. The action above is a visual representation.

01

One main message

Start with the decision the person needs to make. For communication pieces, aim for three levels: headline, explanation and action. Do not turn every sentence into a separate block.

02

Alignment before decoration

Define the format, margins and grid before arranging content. Align the headline, copy and CTA to a shared reference. Use a small number of blocks, each organizing one piece of information.

03

Photography with room to breathe

Decide where the subject belongs and where the text goes. Avoid placing letters over faces or busy areas. If reading becomes difficult, move the text onto a solid surface.

04

An intact brand on every surface

Use the official SVG with contrast and space around it. Follow the pilot clear-space and sizing rules in Brand and logos. Never generate the logo inside a photograph or change its proportions.

05

One primary identity per piece

State in the brief who signs the work: the client, 6am or a partnership. In white-label work, the client’s brand leads; do not add a 6am signature by default. Joint lockups need their own specification.

06

Screen and print need different outputs

HEX/RGB values are the digital references. CMYK, spot colors and lime reproduction on paper need their own proof and approval; an automatic conversion does not become an official color.

Illustration explains.

Use illustration to explain an idea that photography cannot resolve. Preserve the flat editorial language already defined for the blog and its category palettes. Do not turn these palettes into new interface colors.

Styles and examples

An icon guides.

Icons help people recognize an action or piece of information. Reuse the existing set with consistent strokes and scale. Avoid a collection of decorative symbols beside every sentence.

From rule to finished piece.

Composition recipes
16:9 + mobile crop

A page opening

One clear promise, a scene that helps explain it and one primary action. Plan the text area before selecting the photograph.

1:1 or 9:16

A social post

One idea per piece. A short headline, an image with a focal point that reads on a small screen, and a consistent signature. Check the areas occupied by the channel’s interface.

Depends on the document

A case study or presentation

Separate context, completed work and evidence. Use real photographs for results and identify illustrations. Reuse the same hierarchy across pages.

These recipes guide production. Editable presentation and document templates are still planned; social examples are available in Social media.