Compose styles
Rather than blending styles toward a middle, this gives them roles. The first one carries the structure, the next comes in as the accent, and anything after that shows up in a single detail. Where they fight each other, it says so before you start.
How to divide the work
- Composition
- Follow Frutiger Aero: Give the lower half to water and grass, float the product above
- Type
- Set in Frutiger Aero's manner (Rounded humanist sans set bold with a faint gloss), and let Web 2.0 Gloss's lettering (A rounded sans-serif) appear only where you want the eye to catch.
- Material
- Ground in Frutiger Aero's material (Sky blue gradients, transparent bubbles, water drops, strong highlights); bring in exactly one thing from Web 2.0 Gloss (Blue gradients, white highlights).
- Colour
- Build on #62bde7, #7fbd42, #f5fbff and admit one accent from #e7f5ff, #2b93de, #174d82.
Where they fight
- Frutiger Aero and Web 2.0 Gloss both belong to Digital Retro, so the difference is small. Push the roles further apart than feels comfortable.
Caution
- Frutiger Aero Adding bubbles and gloss without saying anything about the technology turns the image into nostalgic wallpaper and the product goes unexplained.
- Web 2.0 Gloss In real UI, restrain shadows and reflections so state differences stay legible.
Image prompt
Produce four original images that take their structure from Frutiger Aero (style, mid-2000s–early 2010s) and their accent from Web 2.0 Gloss (style, 2000s). ## What to make Make the kind of thing Frutiger Aero exists for: launching consumer hardware or apps that need to feel warm rather than technical, or advertising water or environmental services as a clean and bright future. Choose one subject and hold it across all four. ## Structure comes from Frutiger Aero - Blue sky and grass - Transparent bubbles - Glossy UI - Humanist type Composition: Give the lower half to water and grass, float the product above. Type and lettering: Rounded humanist sans set bold with a faint gloss. ## Accent comes from Web 2.0 Gloss, used sparingly - Glossy buttons - Strong gradients - Reflections - Rounded corners Let one material quality come from it: Blue gradients, white highlights. ## Colour and feeling Build the ground on #f5fbff, carry the structure in #62bde7 and #7fbd42, and let a single accent come from #2b93de. These are read off real works, so a direction rather than a fixed palette. Feeling to carry: futurity, intimacy, nostalgia, play. ## Where they fight - Frutiger Aero and Web 2.0 Gloss both belong to Digital Retro, so the difference is small. Push the roles further apart than feels comfortable. ## What goes wrong - Frutiger Aero: Adding bubbles and gloss without saying anything about the technology turns the image into nostalgic wallpaper and the product goes unexplained. - Web 2.0 Gloss: In real UI, restrain shadows and reflections so state differences stay legible. ## Across the four Keep the roles fixed in all four. Vary the framing, the scale and the arrangement so the set shows what this pairing can do rather than four versions of one picture. ## Constraints - Do not imitate, reference or name any specific artist, studio, brand, character or copyrighted work. - Do not reproduce the composition of an existing work. - Produce original compositions in the general period languages described above.
Related entries
- Frutiger Aero mid-2000s–early 2010s / Style / Digital Retro
Shows glossy digital technology as an approachable future by tying it to blue sky, water, grass and bubbles. The gloss is the same as Aqua's, but Aqua is the texture of a control and this is the world of the wallpaper and the advert.
- Web 2.0 Gloss 2000s / Style / Digital Retro
Explains digital interaction as something touchable through gloss, roundness and reflection. It names what the web made when it tried to reproduce the texture of Aqua with images and CSS.
Share this composition:https://indexstyle.org/compose?ids=frutiger-aero+web-two-gloss