SlideShare una empresa de Scribd logo
1 de 25
UX UI
Studierea
utilizatorilor
Arhitectura
contentului
Interactiune
Design
vizual
Culori
Fonturi
Forme GUI
• Abordare
creativa
• Gandire critica
• User flow-uri
• Scenarii
• Design
concentrate
pe om
• Gandire
convergenta
• Gandire
creativa
• Culori
• Font-uri
• Design vizual
Structura
Cursului
3
Photoshop Mobile Livrabile UI Review Prototipuri
Photoshop Document
.PSD
Photoshop layers
• Header
• Body
-Text
- Image
- Products• Footer
Smart objects
• Pastreaza claitatea imaginilor
• Pastreaza formele initiale
• Sursa comuna
• Schimbarea contentului
Photoshop etiquette
• Files • Layers • Images • Typo • Exporting
PAUZA
15 min
Mobile
Platforms
Apple iOS
Google Android
MicrosoftWindows Mobile
iOS vs Android
UI
Deliverables
Resurse
icons
logo
font
font icons
Specs
Dimensiuni (px)
Marime font
Culoare font
Type face
Spacing
Lungime
Spatiere
Dimensiuni
Typo
Open Sans
Bold 14
#ffffff
Typo
Open Sans
Bold 30
#888888
Typo
Open Sans
Reg 12
#888888
100 px
380 px
40 px
400 px
Specs - Spacing
Apple iOS
@x1 non-retina
@x2 retina
@x3 HD retina
Google Android
Mdpi
Hdpi
Xhdpi
Xxhdpi
Xxxhdpi
Dimensiuni pentru resurse
PAUZA
15 min
• Elementele de design • Elementele de text • Elementele vizuale • Interactiunile utilizatorului
UI
Review
UI review checklis
• Sunt toate elementele
de interfață
etichetate?
• Sunt caracteristici sau
funcționalitatile legate
grupate și etichetate
în mod
corespunzător?
• Exista indicatori vizuali
care separa
elementele si grupele
de elemente ?
• Sunt toate etichetele
aliniate corespunzator
cu interfetele ?
Alinierea orizontala cu
boxurile,
checkboxurile,
butoanele. Folositi
masuratorile de
ecram pentru a
confirma aliniamentul.
• In cazul adaptarii site-
ului la alta limba, se
poate citit de la
dreapta la stanga ?
• Este distanta pe
vertical intre
elementele
individuale sau
elementele similar ?
Folositi masuratorile
de ecran pentru a
confirma aliniamentul
• Exista spatiu sufficient
in fereastra browser-
ului , etichetele permit
amplasarea altor texte
in toate limbile site-
ului ? Spre exemplu
cuvintele germane
pot utiliza cu 30% mai
mult spatiu.
Crearea de prototipe
https://youtu.be/zNoBmjg-NnQ
7 motive pentru a folosi invison pentru a crea prototipuri
• Prezentare
• Control asupra designului
• Notite
• Mobile
• Sincronizare• Hover states
• Live share
Multumesc, ne vedem in data de
28 MARTIE

Más contenido relacionado

Destacado

How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Destacado (20)

2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
 
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 

UX/UI Third Course