SlideShare a Scribd company logo
1 of 31
Download to read offline
ChiaraAliotta,UntilSunday
BACKTOTHEFUTUREII
Robert Zemeckis, 1989
YOU CAN BUILD GREAT WEBSITES. WE CAN HELP. ostraining.com
La mia agenda
2015
RICH TEA
DEBATEBETWEENDESIGNERSANDDEVELOPERS
DESIGNER’SPEAK DEVELOPER’SPEAK
A style guide establishes 

and enforces style, enabling brand stewardship
and improving communication.
Hart's Rules
for Compositors
and Readers at the
University Press
ACS style
Effective Communication
of Scientific Information
BJCP style
Style Guidelines for
Beer, Mead and Cider
1893 1986 1985
The Bluebook
A Uniform System
of Citation
1939
COLOURS
LOGO MARK
MARK
TYPOGRAPHY
Heading 01
Heading 02
Heading 03
Heading 04
Heading 05
Heading 06
DESIGN
STYLE GUIDE
LAYOUTBRANDIDENTITY
Space around the logotype
Logotype on different backgrounds
Official brand colours
TYPOGRAPHY
Official and alternative typefaces
Headings and paragraph

Hierarchy and style
LAYOUT
Basic grid principles
Different layout variations
Column differentiation
IMAGES&ILLUSTRATIONS
Standard format and size
Context, mood and concepts
User interface integration
CMYKWORLDTRAVELLINGINTIMEANDSPACE
BRAND IDENTITY
1947
1947 Jan Tschichold: Penguin Composition Rules
1937 1947 2003
TODAY Monocle media brand
monocle.com
TYPOGRAPHY
1966
1966 Wim Crouwel: De Letter…n
TODAY Résidence Mixte
residence-mixte.com
LAYOUT
1926
1926 Karel Teige: Abeceda (Alphabet)
TODAY Interview online magazine
interviewmagazine.com
TODAY Bloomberg online magazine
bloomberg.com
IMAGES
1931
1931 Piet Zwart: Reclame
TODAY Coup De Coeur
coupdecoeur.ca
TODAY Space Matters
space-matters.com
HERETOSTAYTHEDIGITALERAISEVOLVING
NOW LISTENING TO
SPACEODDITY
NEWEMAILS!
REPLY NOW REMIND ME LATER
2
MUMCALLING!
ANSWER CALL BACK LATER
VIDEOMEETING
9:30AMGMT (+2)
INTHEAGEOFE-READERS…
New Yorkers reading. Photos by Lawrence Schwartzwald, 2013
Nothing is lost, nothing is created,
everything is transformed.
Antoine Lavoisier
(1743-1794)
@ChiaraAliotta
untilsunday.it

More Related Content

More from Chiara Aliotta

Il Designer senza macchia e senza paura
Il Designer senza macchia e senza pauraIl Designer senza macchia e senza paura
Il Designer senza macchia e senza pauraChiara Aliotta
 
The Faultless Designer
The Faultless DesignerThe Faultless Designer
The Faultless DesignerChiara Aliotta
 
Once Upon a Time. How to create visual storytelling on the web.
Once Upon a Time. How to create visual storytelling on the web.Once Upon a Time. How to create visual storytelling on the web.
Once Upon a Time. How to create visual storytelling on the web.Chiara Aliotta
 
A day in the life of a UX designer
A day in the life of a UX designerA day in the life of a UX designer
A day in the life of a UX designerChiara Aliotta
 
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...Chiara Aliotta
 
In viaggio verso Grandi Luoghi (You're off to Great Places)
In viaggio verso Grandi Luoghi (You're off to Great Places)In viaggio verso Grandi Luoghi (You're off to Great Places)
In viaggio verso Grandi Luoghi (You're off to Great Places)Chiara Aliotta
 

More from Chiara Aliotta (11)

Back FOR the Future
Back FOR the FutureBack FOR the Future
Back FOR the Future
 
Il Designer senza macchia e senza paura
Il Designer senza macchia e senza pauraIl Designer senza macchia e senza paura
Il Designer senza macchia e senza paura
 
The Faultless Designer
The Faultless DesignerThe Faultless Designer
The Faultless Designer
 
The Shape of Thoughts
The Shape of ThoughtsThe Shape of Thoughts
The Shape of Thoughts
 
I put a spell on you
I put a spell on youI put a spell on you
I put a spell on you
 
Unforgettable brands
Unforgettable brandsUnforgettable brands
Unforgettable brands
 
Once Upon a Time. How to create visual storytelling on the web.
Once Upon a Time. How to create visual storytelling on the web.Once Upon a Time. How to create visual storytelling on the web.
Once Upon a Time. How to create visual storytelling on the web.
 
A day in the life of a UX designer
A day in the life of a UX designerA day in the life of a UX designer
A day in the life of a UX designer
 
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...
The Future of the Web is Printed - Revisited edition for AWWWARDS Conference,...
 
In viaggio verso Grandi Luoghi (You're off to Great Places)
In viaggio verso Grandi Luoghi (You're off to Great Places)In viaggio verso Grandi Luoghi (You're off to Great Places)
In viaggio verso Grandi Luoghi (You're off to Great Places)
 
How to kill a brand
How to kill a brandHow to kill a brand
How to kill a brand
 

Recently uploaded

Solutions For Social Media App Development (1).pptx
Solutions For Social Media App Development (1).pptxSolutions For Social Media App Development (1).pptx
Solutions For Social Media App Development (1).pptxBrain Inventory
 
Edward Boginsky's Trailblazing Contributions to Printing
Edward Boginsky's Trailblazing Contributions to PrintingEdward Boginsky's Trailblazing Contributions to Printing
Edward Boginsky's Trailblazing Contributions to PrintingEdward Boginsky
 
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证ugzga
 
Academic Portfolio (2017-2021) .pdf
Academic Portfolio (2017-2021)      .pdfAcademic Portfolio (2017-2021)      .pdf
Academic Portfolio (2017-2021) .pdfM. A. Architects
 
Gamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad IbrahimGamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad Ibrahimamgadibrahim92
 
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...drmarathore
 
Rise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionRise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionVictoria Gaitskell
 
Resume all my skills and educations and achievement
Resume all my skills and educations and  achievement Resume all my skills and educations and  achievement
Resume all my skills and educations and achievement 210303105569
 
Branding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfBranding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfAlexandra Plesner
 
Software Architecture - Architecture Styles and Patterns-1.pdf
Software Architecture - Architecture Styles and Patterns-1.pdfSoftware Architecture - Architecture Styles and Patterns-1.pdf
Software Architecture - Architecture Styles and Patterns-1.pdfjordantsagmo
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...drmarathore
 
TRose UXPA Experience Design Concord .pptx
TRose UXPA Experience Design Concord .pptxTRose UXPA Experience Design Concord .pptx
TRose UXPA Experience Design Concord .pptxtrose8
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证ugzga
 
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURE
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTUREGBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURE
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURECHANDRAKIRTISINGH
 
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理thubko
 
Spring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisSpring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisPeclers Paris
 
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证ugzga
 
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样awasv46j
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证ugzga
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质yzeoq
 

Recently uploaded (20)

Solutions For Social Media App Development (1).pptx
Solutions For Social Media App Development (1).pptxSolutions For Social Media App Development (1).pptx
Solutions For Social Media App Development (1).pptx
 
Edward Boginsky's Trailblazing Contributions to Printing
Edward Boginsky's Trailblazing Contributions to PrintingEdward Boginsky's Trailblazing Contributions to Printing
Edward Boginsky's Trailblazing Contributions to Printing
 
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
 
Academic Portfolio (2017-2021) .pdf
Academic Portfolio (2017-2021)      .pdfAcademic Portfolio (2017-2021)      .pdf
Academic Portfolio (2017-2021) .pdf
 
Gamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad IbrahimGamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad Ibrahim
 
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...
Abortion pills in Kuwait ☑️+966505195917( top cytotec pills)with delivery ava...
 
Rise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionRise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintAction
 
Resume all my skills and educations and achievement
Resume all my skills and educations and  achievement Resume all my skills and educations and  achievement
Resume all my skills and educations and achievement
 
Branding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfBranding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdf
 
Software Architecture - Architecture Styles and Patterns-1.pdf
Software Architecture - Architecture Styles and Patterns-1.pdfSoftware Architecture - Architecture Styles and Patterns-1.pdf
Software Architecture - Architecture Styles and Patterns-1.pdf
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
 
TRose UXPA Experience Design Concord .pptx
TRose UXPA Experience Design Concord .pptxTRose UXPA Experience Design Concord .pptx
TRose UXPA Experience Design Concord .pptx
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
 
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURE
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTUREGBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURE
GBU INDOOR STADIUM CASE STUDY DESCRIBING ITS STRUCTURE
 
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
 
Spring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisSpring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers Paris
 
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
 
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样
如何办理(UPM毕业证)马来西亚博特拉大学毕业证成绩单留信学历认证原版一模一样
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质
 

The future of the web is printed