Compose two styles

Rather than blending two styles into a middle, this assigns them roles: one carries the structure, the other appears as an accent. Where the two fight, it says so before you start.

How to divide the work

Composition
Follow Flat Design / Vector Minimalism: Simple silhouettes and clear hierarchy
Type
Set in Flat Design / Vector Minimalism's manner (A rounded sans-serif), and let Skeuomorphism's lettering (A humanist face suited to the purpose) appear only where you want the eye to catch.
Material
Ground in Flat Design / Vector Minimalism's material (Three to five colors; shadows only when they mean something); bring in exactly one thing from Skeuomorphism (Precision texture only where it serves function).
Colour
Build on #e9f1e4, #ef6651, #3a68a8 and admit one accent from #d6b47b, #7a4d2c, #39342e.

Where they fight

  • Both belong to UI Expression, so the difference is small. Push the roles further apart than feels comfortable.

Caution

  • Flat Design / Vector Minimalism Figures easily become generic. Define your own ratios, lines and color rules.
  • Skeuomorphism Ornament must not bury the interaction. Expect generations who don't share the metaphor.

Image prompt

An original image that takes its structure from Flat Design / Vector Minimalism (Style, 2010s–) and its accent from Skeuomorphism (Style, 2000s–2010s). Structural cues: Uniform planes; Simple shapes; Few shadows; Clear color. Accent cues, used sparingly: Leather, metal, paper; Dimensional shadows; Real-world metaphors; Fine textures. Composition: Simple silhouettes and clear hierarchy. Type and lettering: A rounded sans-serif. Let one material quality come from the second style: Precision texture only where it serves function. Mood: Trust, Intimacy, Play, Nostalgia. Color: build on #e9f1e4, #ef6651, #3a68a8 with a single accent drawn from #d6b47b, #7a4d2c, #39342e. Constraints: do not imitate, reference or name any specific artist, studio, brand, character or copyrighted work. Produce an original composition in the general period languages described above.

Related entries

  • Flat Design / Vector Minimalism 2010s– / Style / UI Expression

    Reduces information to plain planes and color, portable across screens and media.

  • Skeuomorphism 2000s–2010s / Style / UI Expression

    Borrows cues from real materials and tools to make unknown interactions understandable. It names the principle, so Aqua and Brushed Metal are what the principle looked like when one company shipped it.

Share this pairing:
https://indexstyle.org/compose?ids=flat-design+skeuomorphism

Back to index position