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

group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case StudySophia Viganò
 
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our SiteHow to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Sitegalleryaagency
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degreeyuu sss
 
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi
 
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书zdzoqco
 
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一A SSS
 
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...katerynaivanenko1
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCRdollysharma2066
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Servicejennyeacort
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIyuj
 
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfArchitecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfSumit Lathwal
 
PORTAFOLIO 2024_ ANASTASIYA KUDINOVA
PORTAFOLIO   2024_  ANASTASIYA  KUDINOVAPORTAFOLIO   2024_  ANASTASIYA  KUDINOVA
PORTAFOLIO 2024_ ANASTASIYA KUDINOVAAnastasiya Kudinova
 
Design principles on typography in design
Design principles on typography in designDesign principles on typography in design
Design principles on typography in designnooreen17
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10uasjlagroup
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,Aginakm1
 

Recently uploaded (20)

group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case Study
 
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our SiteHow to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Site
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
 
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.
 
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
 
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一
办理学位证(NTU证书)新加坡南洋理工大学毕业证成绩单原版一比一
 
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
 
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdfArchitecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdf
 
PORTAFOLIO 2024_ ANASTASIYA KUDINOVA
PORTAFOLIO   2024_  ANASTASIYA  KUDINOVAPORTAFOLIO   2024_  ANASTASIYA  KUDINOVA
PORTAFOLIO 2024_ ANASTASIYA KUDINOVA
 
Design principles on typography in design
Design principles on typography in designDesign principles on typography in design
Design principles on typography in design
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
 

The future of the web is printed