Top Banner
WEBSTYLES WEBCANDY FROM THE UNDERGROUND
52

WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Dec 25, 2015

Download

Documents

Louise Butler
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

WEBSTYLESWEBCANDY FROM THE

UNDERGROUND

Page 2: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

GOTHIC ORGANIC STYLE

Page 3: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Organic: uses human forms, plant forms, organic shapes and textures as building blocks

Gothic: death rock, black clothing, self mutilating performance art, cadavers, decay, dark backgrounds

Page 4: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Guggenheim New York

Guggenheim Bilbao

Page 5: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Entropy8.com by Aurelia Harvey:webmuseum

.dk: http://wm.re-cph.com/39

Page 6: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.
Page 7: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Analogue Background Textures.

Foreground Images with Irregular Borders.

Transparent Animated Gifs.

Controlled Window Sizes.

Intentional Exploitation of Vertical Scrolling.

Page 8: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

GRID-BASED ICON STYLE

Page 9: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Respect for Bauhaus Design

Fetish for maps, charts and graphs

Exploit the limits of the web for fun and profit

Found objects

Page 11: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Melding Photography with Grid-Based Layouts.

Using Chartjunk as Design.

Page 12: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

LO-FI GRUNGE STYLE

Page 13: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Color bleeding

Smudges

Irregularities

Dirty

Pre-digital underground poster

Anti-Grid

Page 14: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒ

for at man kan se dette billede.

Control skateboards, deck graphics 1998

By Miika Saksi http://www.sueellen.org

Page 15: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Mesoa by gamedesigner and webdesigner Jukka Merikantos, 1999 sampling and montage – inspiration: David Carson and 1990’ies magazines Emigre and Beach Culture.

Page 16: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Scanlines.

Brushes for Smudges.

Motion Within a Collage

Page 17: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

PAPER BAG STYLE

Page 18: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Cartoonish

Playful

Seemingly sloppy design

Colorless palette

Asymmetrical fonts

Scanned sketchbook drawings

Paperbag texture

Page 19: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.
Page 20: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

King Kipplehttp://funnygarbage.com

1996 Dada-aesthetics - newspaper cut up, sketches, gif animations and humor

Page 21: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Christopher and Matthew Pacetti:

/http://www.p2output.com

http://www.stereomedia.net/

Page 22: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Paper Bag Textures.

Intentional Misalignment and Sloppy Boundaries.

Judicious Color Usage.

The Nomadic Navigation Bar.

Page 23: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

MONDRIAN POSTER STYLE

Page 24: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Advantage of negative space

Bold blocks of color

Full screen

Minimalistic

Page 25: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Piet Mondrian, Compositions 1930

Page 26: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

http://www.bauhaus.de/

Page 27: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Joshua Davies: http://www.once-upon-a-forest.com/

About his colors: http://www.apple.com/pro/profiles/joshuadavis/

Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒfor at man kan se dette billede.Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒfor at man kan se dette billede.

Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒfor at man kan se dette billede.Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒfor at man kan se dette billede.

Page 28: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Holistic Browser Window Design.

The Frames Solution.

The Full-Screen Flash Solution.

The Fixed-Size Solution.

The Pop-Up Window Solution.

Navigation Integrated into Overall Page Design.

Intentional Color Palette.

Page 29: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

PIXELATED PUNK ROCK STYLE

Page 30: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Media aware webstyle

Off-putting

Disorientation

Annoying

User-unfriendly

Dada

Abstract

Surrealistic

Page 32: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Rogue Multimedia.

Full-Screen Control.

onmouseover Functions.

Big Old Ugly HTML Text.

Page 33: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

SUPERTINY SIMCITY STYLE

Page 34: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Pixel Picassos:

Low-res video game designers from the 1980’ies - darlings of the modern web design underground

Page 36: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Tiny Pixelated People, Buildings, and Objects.

Pixelated Fonts.

Extreme Compartmentalization.

Page 37: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

HTMininimaLism

Page 38: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Guru Jakob Nielsen

Beauty from the code

Effective communication

Clean, uncluttered look

Quick loading Gifs

No-nonsense attitude

Page 39: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

http://www.gettyimages.com

http://www.useit.com/ Jacob Nielsen

http://www.facebook.com/

http://www.apple.com/

Der kr ves QuickTime og ᄒ ᆰet TIFF (ukomprimeret)-komprimeringsv rkt j,ᄒ

for at man kan se dette billede.

Page 40: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

DRAFTING TABLE/TRANSFORMER STYLE

Page 41: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Bold conglomeration of 3D shapes floating in seminegative space.

Futuristic sci-fi look

Inspiration from instruction manuals and small print disclaimers

Cryptic navigation elements

Edgy and aggressive

Page 42: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Mike Young’s http://www.designgraphik.com/

Page 43: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.
Page 44: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Arkitekt Zaha Hadid

Page 45: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

3D Modeling Software. 3dsmaxOpen Source: Blender 2D til at skabe 3D: Auto-Illustrator

Tiny Illegible Type.

Page 46: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

1950s HELLO KITTY STYLE

Page 47: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Funky amalgam of Japanese comics, Swiss marionettes and 1950ies chrome metal campers

Amy Franceschini

3D bubble people

Surrealistic environment

Retro futuristic from the 1950ies

Page 48: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

FutureFarmers i 1950er Hello Kitty Style

Page 50: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Milkyelephant.com

Page 51: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Tiny 3D Bubble People/Large 3D Text.

Rounded, Organic Borders.

Pastel Palettes.

50s Fonts/50s Art

Page 52: WEBSTYLES WEBCANDY FROM THE UNDERGROUND. GOTHIC ORGANIC STYLE.

Kilde:

Curt Cloninger: Fresh Styles for Web Designers. New Riders, 2001

http://lab404.com