Konference / Huset Markedsføring / Responsive design

Introslide: Start alle præsentationer med denne RESPONSIVE

DESIGN

HUSET MARKEDSFØRING

VED PETER SOLOW & HJØRDIS THORBORG

Dagsorden: Vis emner og evt. underemner der gennemgåes

Statements: Identitetsskabende statements eller vigtige postulater vises på denne type slide. Benyt evt. hvid baggrund eller fotobaggrunde fra serveren.

RESPONSIVE DESIGN 21. JUNI 2012


RESPONSIVE DESIGN

21. JUNI 2012

130 WEBSITES


RESPONSIVE DESIGN

21. JUNI 2012


RESPONSIVE DESIGN

21. JUNI 2012

2.738 WEBSITES


RESPONSIVE DESIGN

22. JUNI 2012

23.500 WEBSITES


RESPONSIVE DESIGN

21. JUNI 2012



RESPONSIVE DESIGN

21. JUNI 2012


RESPONSIVE DESIGN

21. JUNI 2012

~ 367.000.000 WEBSITES


RESPONSIVE DESIGN

21. JUNI 2012


RESPONSIVE WEB DESIGN

”AT IT’S MOST BASIC LEVEL, RESPONSIVE DESIGN IS ABOUT SERVING ONE HTML DOCUMENT TO COUNTLESS BROWSERES AND DEVICES...”

Ethan Marcotte, Responsive web design

Forretnings-område: Billeder bør ikke udskiftes, medmindre de er direkte misvisende for emnet du præsenterer.


RESPONSIVE DESIGN

21. JUNI 2012


DESIGNOPMENT

”…COMBINING DESIGN AND DEVELOPMENT INTO ONE HYBRID PHASE, BRINGING THE TWO TEAMS INTO ONE HIGHLY COLLABORATIVE GROUP.”

Ethan Marcotte, Responsive web design


RESPONSIVE DESIGN

21. JUNI 2012


MODUL IA

RESPONSIVE DESIGN

21. JUNI 2012


LIVE MOCKUP – BREAKPOINT IDENTIFIKATION

RESPONSIVE DESIGN

1240 PX 768 PX 320 PX

21. JUNI 2012




RESPONSIVE DESIGN

21. JUNI 2012


RESPONSIVE DESIGN

21. JUNI 2012

Kapitel: Benyttes som kapitel intro

ET DESIGNBLIK PÅ RESPONSIVE WEB DESIGN


Delafsnit: Afsnit under kapitler. Husk at angive aktuelt kapitel

DESIGN + DEVELOPMENT

= DESIGNOPMENT

21. JUNI 2012 RESPONSIVE DESIGN


RESEARCH DESIGNER

STRATEGISK DESIGNER

UX-DESIGNER

INTERAKTIONSDESIGNER

CO-DESIGNER


Illustration / site: Du kan selv tilføje markeringspile fra elementarket.


WEB DESIGN TRENDS



WEB DESIGN TRENDS IN 2011

(WEB DESIGN LEDGER)



RESPONSIVE DESIGN

Indholdsslide: Almindelig indholdsside med punktopstilling

WEB DESIGN TRENDS 2011

1.  MORE CSS3 + HTML5

2.  SIMPLE COLOR SCHEMES

3.  MOBILE READY

4.  PARALLAX SCROLLING

5.  DESIGNING FOR TOUCH SCREENS, NOT MICE

6.  DEPTH PERCEPTION IN WEB DESIGN

7.  LARGE PHOTOGRAPHIC BACKGROUNDS

8.  ADVENTUROUS DOMAIN NAMES & INTEGRATION

9.  QR: QUICK RESPONSE

10.  THUMBNAIL DESIGN

11.  CONSTANT CONNECTION/ LIFE STREAM



WEB DESIGN TRENDS IN 2012

(WEB DESIGN LEDGER)



RESPONSIVE DESIGN



1.  RESPONSIVE WEB DESIGN

2.  FIXED-POSITION NAVIGATION

3.  CIRCLES

4.  BIG VECTOR ART

5.  MULTI-COLUMN MENUS

6.  JQUERY/CSS3/HTML5 ANIMATION

7.  RIBBONS & BANNER GRAPHICS

8.  CUSTOM FONT FACES

9.  INFOGRAPHICS

10.  FOCUS ON SIMPLICITY



CSS3 + HTML5

BÅNDBREDDE

BROWSERSTANDARDER

(SKÆRMSTØRRELSE)

KONVENSIONER



FORM FOLLOWS FUNCTION

FORM FOLLOWS MEANING

(KLAUS KRIPPENDORFF)



“YOU WANT [NEW TECHNOLOGY] TO

BECOME A MORE FUNDAMENTAL

PART OF YOUR LIFE, AND YOU WANT

PLEASURABLE THINGS … ARTWORKS,

AND PHOTOGRAPHS … WE WANT THAT

OUT OF OUR TECHNOLOGY TOO.”

(DONALD NORMAN)




1.  RESPONSIVE WEB DESIGN

2.  FIXED-POSITION NAVIGATION

3.  CIRCLES

4.  BIG VECTOR ART

5.  MULTI-COLUMN MENUS

6.  JQUERY/CSS3/HTML5 ANIMATION

7.  RIBBONS & BANNER GRAPHICS

8.  CUSTOM FONT FACES

9.  INFOGRAPHICS

10.  FOCUS ON SIMPLICITY



RESPONSIVE DESIGN


RESPONSIVE DESIGN


RESPONSIVE DESIGN


15 TOP WEB DESIGN AND

DEVELOPMENT TRENDS FOR 2012

(.NET MAGAZINE)



WEB DESIGN AND DEVELOPMENT TRENDS 2012

1.  PROGRESSIVE ENHANCEMENT

2.  RESPONSIVE DESIGN

3.  FLASH WILL SURVIVE

4.  NATIVE SUPPORT FOR PLUG-IN FEATURES

5.  APPIFICATION TAKES HOLD

6.  WEB APP FRAGMENTATION

7.  MOBILE GETS BIGGER

8.  A DEVICE EXPLOSION

9.  RESPECT BEYOND AESTHETICS

10.  SOCIAL BATTLES HEAT UP

11.  GROWTH OF THE TWO-SCREEN MODEL



“THE WEB HAS MOVED BEYOND

THE DESKTOP AND

IT’S NOT MOVING BACK”

(ETHAN MARCOTTE)



VISUEL IDENTITET PÅ DIGITALE PRÆMISSER



RESPONSIVE WEB DESIGN

CASES









LOGO SOM MÆRKE

CASES













MIT MEDIA LAB

CASE









CX

CASE









WORDPRESS

CASE




BRANDING & RESPONSIVE WEB DESIGN



“WE CAN EMBRACE THE

FLEXIBILITY INHERENT TO THE

WEB, WITHOUT SURRENDERING

THE CONTROL WE REQUIRE

AS DESIGNERS”

(ETHAN MARCOTTE)



CBS

CASE



RESPONSIVE DESIGN
























RESPONSIVE DESIGN


MORGENBOOSTER


RESPONSIVE DESIGN


RESPONSIVE DESIGN









“I THINK WHAT IS

HAPPENING ON THE WEB,

THE INTERNET,

IS THAT IN SOME SENSE IT’S

DISAPPEARING”

(DONALD NORMAN)


“I WOULD LIKE TO SEE

WEB DESIGNERS DISAPPEAR

AND BECOME DESIGNERS …

IT’S NOT WEB DESIGN, IT’S

INFORMATION DESIGN,

COMMUNICATION DESIGN.”

(DONALD NORMAN)


RESPONSIVE WEB DESIGN SET FRA ET KUNDEPERSPEKTIV


Indholdsslide: Almindelig indholdsside med punktopstilling 1.  BETYDNING FOR TILBUD OG BUDGET

2.  RESPONSIVE WEB DESIGN I ONLINE STRATEGI

3.  DYNAMISKE PRINCIPPER I DESIGN KONCEPT

4.  “LIVE” PROTOTYPE DEL AF DEN AGILE PROCES

5.  “LIVE” VISNING PÅ DESIGN PRÆSENTATIONER

6.  HTML SOM DESIGN LEVERANCE

7.  TILPASNING TVÆRS AF DEVICES = VÆRDISKABELSE

8.  FREMTIDSSIKRING



SPØRGSMÅL


Introslide:

Start alle

præsentationer med

denne

Introslide:

Start alle

præsentationer med

denne

Introslide:

Start alle

præsentationer med

denne TAK!

..


Design

Konference / Huset Markedsføring / Responsive design