SlideShare a Scribd company logo
1 of 39
Download to read offline
Web Design
We explore simplicity.
FVCproductions
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
Overview
Why should I
care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
GITHUB REPO
WITH THE MOST s???
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
Generally speaking…
User Interface
UI UX
User Experience
Repeat Uses
Complex Interactions
Task Completion
Designing Software
vs Designing Websites
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
Pinterest, Twitter, Facebook,
and the Google.
They all love their cards.
Cards
Pinterest, Twitter, Facebook
and the Google.
They all love their cards.
Cards
terest, Twitter, Facebook,
d the Google.
Cards
terest, Twitter, Facebook,
d the Google.
all love their cards.
Cards
Pinterest, Twitter, Facebook
and the Google.
Cards
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
GOOD UXGOOD UI
Header 1
Header 2
Header 3
Body
Quote
Style Guide
Break
It
Down
Planning
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
consider yourself creative, but think of what you’re capable of
producing: beautiful websites, complex gaming worlds, smartphone
apps-- the list is seemingly endless. Here’s a good analogy: Think of
code like music. Both require knowledge of a specific language: Java
for coders and musical notes for musicians. Creativity comes into
play when that knowledge is applied -- when you’re able to string
together notes or pieces of code to create something complex,
intriguing and beautiful, like Beethoven’s 5th Symphony… or Grand
Theft Auto V. In that same vein, approaching creativity through
coding may help you relate to the designers that you work with.
• (3) Send hiring managers a message. Even if employers are not
specifically seeking a coder who understands the design process,
the fact that you can speak the language tells them that you’re
versatile and willing to learn new things.
• (4) Be an invaluable liaison. Knowing how to code and understanding
the design process puts you in the unique position of translating
between two languages – design-speak and code-talk. If you’ve ever
worked with designers, sometimes the jargon they use makes
absolutely no sense to you. Knowing a bit of their lingo can also help
fill the gap.
• (5) Contribute to the design process. When you understand a thing
or two about design, you can provide valuable feedback to the
designer, particularly from a coder’s perspective.
• (6) Feel the designer’s pain. Despite your sincerest efforts, you’ve
come to realize that design just isn’t your thing. But having gone
consider yourself creative, but think of what you’re capable of
producing: beautiful websites, complex gaming worlds, smartphone
apps-- the list is seemingly endless. Here’s a good analogy: Think of
code like music. Both require knowledge of a specific language: Java
for coders and musical notes for musicians. Creativity comes into
play when that knowledge is applied -- when you’re able to string
together notes or pieces of code to create something complex,
intriguing and beautiful, like Beethoven’s 5th Symphony… or Grand
Theft Auto V. In that same vein, approaching creativity through
coding may help you relate to the designers that you work with.
• (3) Send hiring managers a message. Even if employers are not
specifically seeking a coder who understands the design process,
the fact that you can speak the language tells them that you’re
versatile and willing to learn new things.
• (4) Be an invaluable liaison. Knowing how to code and understanding
the design process puts you in the unique position of translating
between two languages – design-speak and code-talk. If you’ve ever
worked with designers, sometimes the jargon they use makes
absolutely no sense to you. Knowing a bit of their lingo can also help
fill the gap.
• (5) Contribute to the design process. When you understand a thing
or two about design, you can provide valuable feedback to the
designer, particularly from a coder’s perspective.
• (6) Feel the designer’s pain. Despite your sincerest efforts, you’ve
come to realize that design just isn’t your thing. But having gone
Big Changes
Big Changes
BAD UXBAD UI
BAD UXGOOD UI
Overview
Why should I care?
What is it
anyways?
Up and Coming
Good Practices
Bad Practices
No, seriously —
why should you
care?
“The other overlooked
aspect of winning a
hackathon is design.”
- M R . YA N G
“Most contestants don’t go past the default designs—how many times have we
all seen that default black navbar from the Twitter’s Bootstrap CSS Framework in
hackathon presentations? If you do this, you’re leaving a huge amount of points
on the table.”
M R . YA N G
If all else fails…
Avoid Unnecessary Work
Design Resources
References
Thanks.
We just explored simplicity.
FVCproductions

More Related Content

More from Frances Coronel

RevolutionConf 2019 - Progressive Web Apps 101
RevolutionConf 2019 - Progressive Web Apps 101RevolutionConf 2019 - Progressive Web Apps 101
RevolutionConf 2019 - Progressive Web Apps 101Frances Coronel
 
JSConf EU 2019 - Being a Unicorn Working for Another Unicorn
JSConf EU 2019 - Being a Unicorn Working for Another UnicornJSConf EU 2019 - Being a Unicorn Working for Another Unicorn
JSConf EU 2019 - Being a Unicorn Working for Another UnicornFrances Coronel
 
Welcome to Slack, Diablo Valley College!
Welcome to Slack, Diablo Valley College!Welcome to Slack, Diablo Valley College!
Welcome to Slack, Diablo Valley College!Frances Coronel
 
Welcome to Slack, Coro Fellows!
Welcome to Slack, Coro Fellows!Welcome to Slack, Coro Fellows!
Welcome to Slack, Coro Fellows!Frances Coronel
 
Telegraph Track - Progressive Web Apps 101
Telegraph Track - Progressive Web Apps 101Telegraph Track - Progressive Web Apps 101
Telegraph Track - Progressive Web Apps 101Frances Coronel
 
Side Hustle: Techqueria.org
Side Hustle: Techqueria.orgSide Hustle: Techqueria.org
Side Hustle: Techqueria.orgFrances Coronel
 
General Assembly - So You Want To Be A Wizard
General Assembly - So You Want To Be A WizardGeneral Assembly - So You Want To Be A Wizard
General Assembly - So You Want To Be A WizardFrances Coronel
 
GDG DevFest 2018 - Progressive Web Apps 101
GDG DevFest 2018 - Progressive Web Apps 101GDG DevFest 2018 - Progressive Web Apps 101
GDG DevFest 2018 - Progressive Web Apps 101Frances Coronel
 
Scenic City Summit 2018 - Progressive Web Apps 101
Scenic City Summit 2018 - Progressive Web Apps 101Scenic City Summit 2018 - Progressive Web Apps 101
Scenic City Summit 2018 - Progressive Web Apps 101Frances Coronel
 
Scenic City Summit 2018 - TypeScript 101
Scenic City Summit 2018 - TypeScript 101Scenic City Summit 2018 - TypeScript 101
Scenic City Summit 2018 - TypeScript 101Frances Coronel
 
GDG SF Meetup - Progressive Web Apps 101
GDG SF Meetup - Progressive Web Apps 101GDG SF Meetup - Progressive Web Apps 101
GDG SF Meetup - Progressive Web Apps 101Frances Coronel
 
A Fullstack Future - Progressive Web Apps
A Fullstack Future - Progressive Web AppsA Fullstack Future - Progressive Web Apps
A Fullstack Future - Progressive Web AppsFrances Coronel
 
SMASH Speaker Series at Stanford University
SMASH Speaker Series at Stanford UniversitySMASH Speaker Series at Stanford University
SMASH Speaker Series at Stanford UniversityFrances Coronel
 
TypeScript 101 - Beer City Code
TypeScript 101 - Beer City CodeTypeScript 101 - Beer City Code
TypeScript 101 - Beer City CodeFrances Coronel
 
TypeScript 101 - We RISE Tech Conference
TypeScript 101 - We RISE Tech ConferenceTypeScript 101 - We RISE Tech Conference
TypeScript 101 - We RISE Tech ConferenceFrances Coronel
 
Progressive Web Apps 101 - NationJS
Progressive Web Apps 101 - NationJSProgressive Web Apps 101 - NationJS
Progressive Web Apps 101 - NationJSFrances Coronel
 
TypeScript 101 - Women Who Code - CONNECT 2018
TypeScript 101 - Women Who Code - CONNECT 2018TypeScript 101 - Women Who Code - CONNECT 2018
TypeScript 101 - Women Who Code - CONNECT 2018Frances Coronel
 
Revolution Conf 2016 - Sponsorship Packages - Version 1
Revolution Conf 2016 - Sponsorship Packages - Version 1Revolution Conf 2016 - Sponsorship Packages - Version 1
Revolution Conf 2016 - Sponsorship Packages - Version 1Frances Coronel
 

More from Frances Coronel (20)

RevolutionConf 2019 - Progressive Web Apps 101
RevolutionConf 2019 - Progressive Web Apps 101RevolutionConf 2019 - Progressive Web Apps 101
RevolutionConf 2019 - Progressive Web Apps 101
 
JSConf EU 2019 - Being a Unicorn Working for Another Unicorn
JSConf EU 2019 - Being a Unicorn Working for Another UnicornJSConf EU 2019 - Being a Unicorn Working for Another Unicorn
JSConf EU 2019 - Being a Unicorn Working for Another Unicorn
 
Welcome to Slack, Diablo Valley College!
Welcome to Slack, Diablo Valley College!Welcome to Slack, Diablo Valley College!
Welcome to Slack, Diablo Valley College!
 
Welcome to Slack, Coro Fellows!
Welcome to Slack, Coro Fellows!Welcome to Slack, Coro Fellows!
Welcome to Slack, Coro Fellows!
 
Telegraph Track - Progressive Web Apps 101
Telegraph Track - Progressive Web Apps 101Telegraph Track - Progressive Web Apps 101
Telegraph Track - Progressive Web Apps 101
 
JSConf Hawaiʻi 2019
JSConf Hawaiʻi 2019JSConf Hawaiʻi 2019
JSConf Hawaiʻi 2019
 
Side Hustle: Techqueria.org
Side Hustle: Techqueria.orgSide Hustle: Techqueria.org
Side Hustle: Techqueria.org
 
General Assembly - So You Want To Be A Wizard
General Assembly - So You Want To Be A WizardGeneral Assembly - So You Want To Be A Wizard
General Assembly - So You Want To Be A Wizard
 
GDG DevFest 2018 - Progressive Web Apps 101
GDG DevFest 2018 - Progressive Web Apps 101GDG DevFest 2018 - Progressive Web Apps 101
GDG DevFest 2018 - Progressive Web Apps 101
 
Scenic City Summit 2018 - Progressive Web Apps 101
Scenic City Summit 2018 - Progressive Web Apps 101Scenic City Summit 2018 - Progressive Web Apps 101
Scenic City Summit 2018 - Progressive Web Apps 101
 
Scenic City Summit 2018 - TypeScript 101
Scenic City Summit 2018 - TypeScript 101Scenic City Summit 2018 - TypeScript 101
Scenic City Summit 2018 - TypeScript 101
 
GDG SF Meetup - Progressive Web Apps 101
GDG SF Meetup - Progressive Web Apps 101GDG SF Meetup - Progressive Web Apps 101
GDG SF Meetup - Progressive Web Apps 101
 
A Fullstack Future - Progressive Web Apps
A Fullstack Future - Progressive Web AppsA Fullstack Future - Progressive Web Apps
A Fullstack Future - Progressive Web Apps
 
SMASH Speaker Series at Stanford University
SMASH Speaker Series at Stanford UniversitySMASH Speaker Series at Stanford University
SMASH Speaker Series at Stanford University
 
TypeScript 101 - Beer City Code
TypeScript 101 - Beer City CodeTypeScript 101 - Beer City Code
TypeScript 101 - Beer City Code
 
TypeScript 101 - We RISE Tech Conference
TypeScript 101 - We RISE Tech ConferenceTypeScript 101 - We RISE Tech Conference
TypeScript 101 - We RISE Tech Conference
 
Progressive Web Apps 101 - NationJS
Progressive Web Apps 101 - NationJSProgressive Web Apps 101 - NationJS
Progressive Web Apps 101 - NationJS
 
TypeScript 101 - Women Who Code - CONNECT 2018
TypeScript 101 - Women Who Code - CONNECT 2018TypeScript 101 - Women Who Code - CONNECT 2018
TypeScript 101 - Women Who Code - CONNECT 2018
 
Revolution Conf 2016 - Sponsorship Packages - Version 1
Revolution Conf 2016 - Sponsorship Packages - Version 1Revolution Conf 2016 - Sponsorship Packages - Version 1
Revolution Conf 2016 - Sponsorship Packages - Version 1
 
Horizons One
Horizons OneHorizons One
Horizons One
 

Recently uploaded

TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
A complete guide to the design thinking process
A complete guide to the design thinking processA complete guide to the design thinking process
A complete guide to the design thinking processRndexperts
 
eCultify brand guidelines- Shamika Dukle.pdf
eCultify brand guidelines- Shamika Dukle.pdfeCultify brand guidelines- Shamika Dukle.pdf
eCultify brand guidelines- Shamika Dukle.pdfswdukle
 
Imagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioImagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioAlinaLau2
 
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Thomas Schielke
 
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...Pranav Subramanian
 
White Label Solutions for Digital Agencies | DevOut Labs.pdf
White Label Solutions for Digital Agencies | DevOut Labs.pdfWhite Label Solutions for Digital Agencies | DevOut Labs.pdf
White Label Solutions for Digital Agencies | DevOut Labs.pdfDevOut Labs
 
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...Pranav Subramanian
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfLucyBonelli
 
How Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesHow Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesThomas Schielke
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks CharlottePulte
 
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy..._Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...JIT KUMAR GUPTA
 
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdf
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdfARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdf
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdfCristobalHeraud
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine CharlottePulte
 
PORTFOLIO 2024 ANASTASIYA KUDINOVA
PORTFOLIO 2024       ANASTASIYA KUDINOVAPORTFOLIO 2024       ANASTASIYA KUDINOVA
PORTFOLIO 2024 ANASTASIYA KUDINOVAAnastasiya Kudinova
 
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...Yantram Animation Studio Corporation
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppNadaMohammed714321
 
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisFW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisPeclers Paris
 
ArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesVellyslav Petrov
 

Recently uploaded (20)

TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
A complete guide to the design thinking process
A complete guide to the design thinking processA complete guide to the design thinking process
A complete guide to the design thinking process
 
eCultify brand guidelines- Shamika Dukle.pdf
eCultify brand guidelines- Shamika Dukle.pdfeCultify brand guidelines- Shamika Dukle.pdf
eCultify brand guidelines- Shamika Dukle.pdf
 
Imagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioImagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering Portfolio
 
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
 
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...
ALISIA: HOW MIGHT WE ACHIEVE HIGH ENVIRONMENTAL PERFORMANCE WHILE MAINTAINING...
 
White Label Solutions for Digital Agencies | DevOut Labs.pdf
White Label Solutions for Digital Agencies | DevOut Labs.pdfWhite Label Solutions for Digital Agencies | DevOut Labs.pdf
White Label Solutions for Digital Agencies | DevOut Labs.pdf
 
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...
LIGHTSCAPES: HOW MIGHT WE DESIGN AN INCLUSIVE AND ACCESSIBLE CLASSICAL CONCER...
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
 
How Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesHow Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives cities
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks
 
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy..._Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
 
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdf
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdfARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdf
ARCHITECTURAL PORTFOLIO CRISTOBAL HERAUD 2024.pdf
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine
 
PORTFOLIO 2024 ANASTASIYA KUDINOVA
PORTFOLIO 2024       ANASTASIYA KUDINOVAPORTFOLIO 2024       ANASTASIYA KUDINOVA
PORTFOLIO 2024 ANASTASIYA KUDINOVA
 
ASME B31.4-2022 estandar ductos año 2022
ASME B31.4-2022 estandar ductos año 2022ASME B31.4-2022 estandar ductos año 2022
ASME B31.4-2022 estandar ductos año 2022
 
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...
Exploring Tehran's Architectural Marvels: A Glimpse into Vilaas Studio's Dyna...
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
 
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisFW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
 
ArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern Homes
 

Fullstack Academy - Tech Talk - Web Design

  • 1. Web Design We explore simplicity. FVCproductions
  • 2. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 3. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 5.
  • 6.
  • 7.
  • 8. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 11.
  • 12. Repeat Uses Complex Interactions Task Completion Designing Software vs Designing Websites
  • 13. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 14. Pinterest, Twitter, Facebook, and the Google. They all love their cards. Cards Pinterest, Twitter, Facebook and the Google. They all love their cards. Cards terest, Twitter, Facebook, d the Google. Cards terest, Twitter, Facebook, d the Google. all love their cards. Cards Pinterest, Twitter, Facebook and the Google. Cards
  • 15.
  • 16.
  • 17.
  • 18. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 20. Header 1 Header 2 Header 3 Body Quote Style Guide
  • 22.
  • 24. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 25. consider yourself creative, but think of what you’re capable of producing: beautiful websites, complex gaming worlds, smartphone apps-- the list is seemingly endless. Here’s a good analogy: Think of code like music. Both require knowledge of a specific language: Java for coders and musical notes for musicians. Creativity comes into play when that knowledge is applied -- when you’re able to string together notes or pieces of code to create something complex, intriguing and beautiful, like Beethoven’s 5th Symphony… or Grand Theft Auto V. In that same vein, approaching creativity through coding may help you relate to the designers that you work with. • (3) Send hiring managers a message. Even if employers are not specifically seeking a coder who understands the design process, the fact that you can speak the language tells them that you’re versatile and willing to learn new things. • (4) Be an invaluable liaison. Knowing how to code and understanding the design process puts you in the unique position of translating between two languages – design-speak and code-talk. If you’ve ever worked with designers, sometimes the jargon they use makes absolutely no sense to you. Knowing a bit of their lingo can also help fill the gap. • (5) Contribute to the design process. When you understand a thing or two about design, you can provide valuable feedback to the designer, particularly from a coder’s perspective. • (6) Feel the designer’s pain. Despite your sincerest efforts, you’ve come to realize that design just isn’t your thing. But having gone
  • 26. consider yourself creative, but think of what you’re capable of producing: beautiful websites, complex gaming worlds, smartphone apps-- the list is seemingly endless. Here’s a good analogy: Think of code like music. Both require knowledge of a specific language: Java for coders and musical notes for musicians. Creativity comes into play when that knowledge is applied -- when you’re able to string together notes or pieces of code to create something complex, intriguing and beautiful, like Beethoven’s 5th Symphony… or Grand Theft Auto V. In that same vein, approaching creativity through coding may help you relate to the designers that you work with. • (3) Send hiring managers a message. Even if employers are not specifically seeking a coder who understands the design process, the fact that you can speak the language tells them that you’re versatile and willing to learn new things. • (4) Be an invaluable liaison. Knowing how to code and understanding the design process puts you in the unique position of translating between two languages – design-speak and code-talk. If you’ve ever worked with designers, sometimes the jargon they use makes absolutely no sense to you. Knowing a bit of their lingo can also help fill the gap. • (5) Contribute to the design process. When you understand a thing or two about design, you can provide valuable feedback to the designer, particularly from a coder’s perspective. • (6) Feel the designer’s pain. Despite your sincerest efforts, you’ve come to realize that design just isn’t your thing. But having gone
  • 27.
  • 32. Overview Why should I care? What is it anyways? Up and Coming Good Practices Bad Practices No, seriously — why should you care?
  • 33. “The other overlooked aspect of winning a hackathon is design.” - M R . YA N G
  • 34. “Most contestants don’t go past the default designs—how many times have we all seen that default black navbar from the Twitter’s Bootstrap CSS Framework in hackathon presentations? If you do this, you’re leaving a huge amount of points on the table.” M R . YA N G
  • 35. If all else fails… Avoid Unnecessary Work
  • 37.
  • 39. Thanks. We just explored simplicity. FVCproductions