SlideShare a Scribd company logo

UI vs UX workshop

Inova LLC
Inova LLC

We’ve all had discussions about the great ‘UX’ of a product, or the poor ‘UI’ of a website. Is it a secret language you will never be lucky to know more about it? Actually, it is very simple, For example: While User Experience is a bunch of tasks focused on optimization of a product for effective and enjoyable use; User Interface Design is its complement, the look and spirit, the presentation and interactivity of a product.

1 of 16
Download to read offline
UI vs UX workshop
UI / UX Workshop
Mobile Track Design
- Understanding UI vs. UX
UI is the user interface. This comprises everything a user can see
and touch, such as menu options, buttons, text, layouts, navigation
elements, sharing options, etc.
UX is why you made that change to affect how the user feels and
behaves. The user experience is an umbrella term for the user’s
overall experience with the product: what they liked about it, how
easily they accomplished their goals, moments of delight and
frustration, etc.
The UI is the paint, the canvas, the types of
strokes and colors. The UX is the wonder you
feel when you see the girl in the pearl earring.
Tools you should learn
- UX Process
- Wireframing
Ad

Recommended

UX/UI Design and How It Works
UX/UI Design and How It WorksUX/UI Design and How It Works
UX/UI Design and How It WorksAciron Consulting
 
What is UI/UX and the Difference
What is UI/UX and the DifferenceWhat is UI/UX and the Difference
What is UI/UX and the DifferenceVibloo
 
UI UX Introductory session
UI UX Introductory sessionUI UX Introductory session
UI UX Introductory sessionSooraj P R
 
UI & UX Design for Startups
UI & UX Design for StartupsUI & UX Design for Startups
UI & UX Design for StartupsRichard Fang
 

More Related Content

What's hot

UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiMatin Maleki
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignKoombea
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideBabajide Aroyewun
 
What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)iFactory Digital
 
"What Are the Key Differences between UI and UX Design?"
"What Are the Key Differences between UI and UX Design?""What Are the Key Differences between UI and UX Design?"
"What Are the Key Differences between UI and UX Design?"MITAcademy1
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyCHI UX Indonesia
 
UX/UI design process - Studio CreativeMe
UX/UI design process - Studio CreativeMeUX/UI design process - Studio CreativeMe
UX/UI design process - Studio CreativeMeMadhuri Garg
 
UX & UI Design - Differentiate through design
UX & UI Design - Differentiate through designUX & UI Design - Differentiate through design
UX & UI Design - Differentiate through designDMI
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience? Dotinum
 
UI UX introduction
UI UX introductionUI UX introduction
UI UX introductionIsmail Norri
 
UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!Jayan Narayanan
 
A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentationaayush_jain_87
 
UX - User Experience Design and Principles
UX - User Experience Design and PrinciplesUX - User Experience Design and Principles
UX - User Experience Design and PrinciplesPeeyush Sahu CAPM®
 
i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design  i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design GDGKuwaitGoogleDevel
 
UI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaUI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaRoshan Karunarathna
 

What's hot (20)

The Importance of UX
The Importance of UXThe Importance of UX
The Importance of UX
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web Design
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 
What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)
 
"What Are the Key Differences between UI and UX Design?"
"What Are the Key Differences between UI and UX Design?""What Are the Key Differences between UI and UX Design?"
"What Are the Key Differences between UI and UX Design?"
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
 
UX is not UI!
UX is not UI!UX is not UI!
UX is not UI!
 
Ux design process
Ux design processUx design process
Ux design process
 
UX/UI design process - Studio CreativeMe
UX/UI design process - Studio CreativeMeUX/UI design process - Studio CreativeMe
UX/UI design process - Studio CreativeMe
 
UX & UI Design - Differentiate through design
UX & UI Design - Differentiate through designUX & UI Design - Differentiate through design
UX & UI Design - Differentiate through design
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience?
 
UI UX introduction
UI UX introductionUI UX introduction
UI UX introduction
 
UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!
 
A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentation
 
UX - User Experience Design and Principles
UX - User Experience Design and PrinciplesUX - User Experience Design and Principles
UX - User Experience Design and Principles
 
i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design  i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design
 
UI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan KarunarathnaUI/UX presentation by Roshan Karunarathna
UI/UX presentation by Roshan Karunarathna
 
UX and UI
UX and UIUX and UI
UX and UI
 
Good UX Bad UX
Good UX Bad UXGood UX Bad UX
Good UX Bad UX
 

Similar to UI vs UX workshop

UI vs. UX: What’s the difference?
UI vs. UX: What’s the difference?UI vs. UX: What’s the difference?
UI vs. UX: What’s the difference?DariaPersell
 
Uxpin mobile UI Design Patterns 2014
Uxpin mobile UI Design Patterns 2014Uxpin mobile UI Design Patterns 2014
Uxpin mobile UI Design Patterns 2014Jessie Doan
 
Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014MoodLabs
 
Mobile ui design patterns
Mobile ui design patternsMobile ui design patterns
Mobile ui design patternsKevinHao14
 
Uxpin mobile ui_design_patterns_2014
Uxpin mobile ui_design_patterns_2014Uxpin mobile ui_design_patterns_2014
Uxpin mobile ui_design_patterns_2014Akhil Kumar
 
Mobile UI Design Patterns 2014
Mobile UI Design Patterns 2014Mobile UI Design Patterns 2014
Mobile UI Design Patterns 2014Lewis Lin 🦊
 
Best Practices for a Great User Experience
Best Practices for a Great User ExperienceBest Practices for a Great User Experience
Best Practices for a Great User ExperienceUser Experience Labs
 
Why Does a UI Matters?
Why Does a UI Matters?Why Does a UI Matters?
Why Does a UI Matters?NotifyVisitors
 
2014 UX/UI trends for mobile solutions
2014 UX/UI trends for mobile solutions2014 UX/UI trends for mobile solutions
2014 UX/UI trends for mobile solutionsDMI
 
Game interface design part 1
Game interface design part 1Game interface design part 1
Game interface design part 1Durgesh Pandey
 
Web UI Design Patterns 2014
Web UI Design Patterns 2014Web UI Design Patterns 2014
Web UI Design Patterns 2014Lewis Lin 🦊
 
UI Development training institute in Bangalore
UI Development training institute in BangaloreUI Development training institute in Bangalore
UI Development training institute in BangaloreMUDDUKRISHNA14
 
UI Development Content
UI Development ContentUI Development Content
UI Development ContentMUDDUKRISHNA14
 
UI Development Content
UI Development ContentUI Development Content
UI Development ContentMUDDUKRISHNA14
 
Achieversit Training Institute in Bangalore 5
Achieversit Training Institute in Bangalore 5Achieversit Training Institute in Bangalore 5
Achieversit Training Institute in Bangalore 5MUDDUKRISHNA14
 
Uxpin web ui_design_best_practices
Uxpin web ui_design_best_practicesUxpin web ui_design_best_practices
Uxpin web ui_design_best_practicesimdurgesh
 
UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015Harsh Wardhan Dave
 

Similar to UI vs UX workshop (20)

UI vs. UX: What’s the difference?
UI vs. UX: What’s the difference?UI vs. UX: What’s the difference?
UI vs. UX: What’s the difference?
 
Uxpin mobile UI Design Patterns 2014
Uxpin mobile UI Design Patterns 2014Uxpin mobile UI Design Patterns 2014
Uxpin mobile UI Design Patterns 2014
 
UI.docx
UI.docxUI.docx
UI.docx
 
UI.docx
UI.docxUI.docx
UI.docx
 
Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014
 
Ui design by mhm
Ui design by mhmUi design by mhm
Ui design by mhm
 
Mobile ui design patterns
Mobile ui design patternsMobile ui design patterns
Mobile ui design patterns
 
Uxpin mobile ui_design_patterns_2014
Uxpin mobile ui_design_patterns_2014Uxpin mobile ui_design_patterns_2014
Uxpin mobile ui_design_patterns_2014
 
Mobile UI Design Patterns 2014
Mobile UI Design Patterns 2014Mobile UI Design Patterns 2014
Mobile UI Design Patterns 2014
 
Best Practices for a Great User Experience
Best Practices for a Great User ExperienceBest Practices for a Great User Experience
Best Practices for a Great User Experience
 
Why Does a UI Matters?
Why Does a UI Matters?Why Does a UI Matters?
Why Does a UI Matters?
 
2014 UX/UI trends for mobile solutions
2014 UX/UI trends for mobile solutions2014 UX/UI trends for mobile solutions
2014 UX/UI trends for mobile solutions
 
Game interface design part 1
Game interface design part 1Game interface design part 1
Game interface design part 1
 
Web UI Design Patterns 2014
Web UI Design Patterns 2014Web UI Design Patterns 2014
Web UI Design Patterns 2014
 
UI Development training institute in Bangalore
UI Development training institute in BangaloreUI Development training institute in Bangalore
UI Development training institute in Bangalore
 
UI Development Content
UI Development ContentUI Development Content
UI Development Content
 
UI Development Content
UI Development ContentUI Development Content
UI Development Content
 
Achieversit Training Institute in Bangalore 5
Achieversit Training Institute in Bangalore 5Achieversit Training Institute in Bangalore 5
Achieversit Training Institute in Bangalore 5
 
Uxpin web ui_design_best_practices
Uxpin web ui_design_best_practicesUxpin web ui_design_best_practices
Uxpin web ui_design_best_practices
 
UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015
 

More from Inova LLC

MVVM presentation
MVVM presentationMVVM presentation
MVVM presentationInova LLC
 
Activities vs fragment
Activities vs fragmentActivities vs fragment
Activities vs fragmentInova LLC
 
Benefits of idea treasury
Benefits of idea treasuryBenefits of idea treasury
Benefits of idea treasuryInova LLC
 
Advertising
Advertising Advertising
Advertising Inova LLC
 
Market research
Market researchMarket research
Market researchInova LLC
 
Disc Personality Type
Disc Personality TypeDisc Personality Type
Disc Personality TypeInova LLC
 
Positive thinking
Positive thinkingPositive thinking
Positive thinkingInova LLC
 
Sketch app interface
Sketch app interfaceSketch app interface
Sketch app interfaceInova LLC
 
CSED 2018 Orientation
CSED 2018 OrientationCSED 2018 Orientation
CSED 2018 OrientationInova LLC
 
Objective C Tricks
Objective C TricksObjective C Tricks
Objective C TricksInova LLC
 
Mind map Introduction
Mind map IntroductionMind map Introduction
Mind map IntroductionInova LLC
 
Agile scheduling
Agile schedulingAgile scheduling
Agile schedulingInova LLC
 
Business plan
Business planBusiness plan
Business planInova LLC
 
Introduction to Sencha touch
Introduction to Sencha touchIntroduction to Sencha touch
Introduction to Sencha touchInova LLC
 
Introduction to Agile
Introduction to AgileIntroduction to Agile
Introduction to AgileInova LLC
 
Internet Presence
Internet PresenceInternet Presence
Internet PresenceInova LLC
 
Agile Planning for value
Agile Planning for valueAgile Planning for value
Agile Planning for valueInova LLC
 
Agile estimate size
Agile estimate sizeAgile estimate size
Agile estimate sizeInova LLC
 

More from Inova LLC (20)

MVVM presentation
MVVM presentationMVVM presentation
MVVM presentation
 
Activities vs fragment
Activities vs fragmentActivities vs fragment
Activities vs fragment
 
Benefits of idea treasury
Benefits of idea treasuryBenefits of idea treasury
Benefits of idea treasury
 
Advertising
Advertising Advertising
Advertising
 
Market research
Market researchMarket research
Market research
 
Disc Personality Type
Disc Personality TypeDisc Personality Type
Disc Personality Type
 
Positive thinking
Positive thinkingPositive thinking
Positive thinking
 
Sketch app interface
Sketch app interfaceSketch app interface
Sketch app interface
 
Inova
InovaInova
Inova
 
Inova
InovaInova
Inova
 
CSED 2018 Orientation
CSED 2018 OrientationCSED 2018 Orientation
CSED 2018 Orientation
 
Objective C Tricks
Objective C TricksObjective C Tricks
Objective C Tricks
 
Mind map Introduction
Mind map IntroductionMind map Introduction
Mind map Introduction
 
Agile scheduling
Agile schedulingAgile scheduling
Agile scheduling
 
Business plan
Business planBusiness plan
Business plan
 
Introduction to Sencha touch
Introduction to Sencha touchIntroduction to Sencha touch
Introduction to Sencha touch
 
Introduction to Agile
Introduction to AgileIntroduction to Agile
Introduction to Agile
 
Internet Presence
Internet PresenceInternet Presence
Internet Presence
 
Agile Planning for value
Agile Planning for valueAgile Planning for value
Agile Planning for value
 
Agile estimate size
Agile estimate sizeAgile estimate size
Agile estimate size
 

Recently uploaded

acervus process book no cover--character
acervus process book no cover--characteracervus process book no cover--character
acervus process book no cover--characterschell
 
impact of packaging on consumer buying behaviour project report pdf.pdf
impact of packaging on consumer buying behaviour project  report pdf.pdfimpact of packaging on consumer buying behaviour project  report pdf.pdf
impact of packaging on consumer buying behaviour project report pdf.pdfSanjivanisShirodkar
 
Carpentry 7-8 explorartory (Week 3).pptx
Carpentry 7-8 explorartory (Week 3).pptxCarpentry 7-8 explorartory (Week 3).pptx
Carpentry 7-8 explorartory (Week 3).pptxMonroewellFajardo
 
Mother Courage and Her Children Layouts.pdf
Mother Courage and Her Children Layouts.pdfMother Courage and Her Children Layouts.pdf
Mother Courage and Her Children Layouts.pdfLizShek
 
creating my own logo and icon.pptx
creating my own logo and icon.pptxcreating my own logo and icon.pptx
creating my own logo and icon.pptxChloeMeadows1
 
Presentation on "Gothic Architecher".pptx
Presentation on "Gothic Architecher".pptxPresentation on "Gothic Architecher".pptx
Presentation on "Gothic Architecher".pptxASHIQUR RAHMAN
 
Studio Surfaced - Textile Design Studio based out of Delhi NCR
Studio Surfaced - Textile Design Studio based out of Delhi NCRStudio Surfaced - Textile Design Studio based out of Delhi NCR
Studio Surfaced - Textile Design Studio based out of Delhi NCRSurfaced - Designs By Meera Narula
 
Land Management and sourcing land for sustainable Urban Development.
Land Management and sourcing land for sustainable Urban Development.Land Management and sourcing land for sustainable Urban Development.
Land Management and sourcing land for sustainable Urban Development.JIT KUMAR GUPTA
 
Amadeus Hang and Cable Layouts UNCSA.pdf
Amadeus Hang and Cable Layouts UNCSA.pdfAmadeus Hang and Cable Layouts UNCSA.pdf
Amadeus Hang and Cable Layouts UNCSA.pdfLizShek
 
Types of Drafting in Construction Projects
Types of Drafting in Construction ProjectsTypes of Drafting in Construction Projects
Types of Drafting in Construction ProjectsResDraft
 
December 2023 Issue - Fnewsmagazine SAIC
December 2023 Issue - Fnewsmagazine SAICDecember 2023 Issue - Fnewsmagazine SAIC
December 2023 Issue - Fnewsmagazine SAICaditisingh523288
 
Preposition for grade 12th Vietnamese student
Preposition for grade 12th Vietnamese studentPreposition for grade 12th Vietnamese student
Preposition for grade 12th Vietnamese studentThaoNguyenDang4
 
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptx
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptxAl-Aqsa Mosque History Thesis Defense by Slidesgo.pptx
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptxBahaaRoshdy1
 
Before and After Wheelchair Accessible Whole Home Remodel.pptx
Before and After Wheelchair Accessible Whole Home Remodel.pptxBefore and After Wheelchair Accessible Whole Home Remodel.pptx
Before and After Wheelchair Accessible Whole Home Remodel.pptxleahlareaupci
 
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdf
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdfASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdf
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdfaekhan1019
 
homescreen revamp homescreen revamphomescreen revamp
homescreen revamp homescreen revamphomescreen revamphomescreen revamp homescreen revamphomescreen revamp
homescreen revamp homescreen revamphomescreen revampvidya934261
 
Heathers Symbols for Gerald Freedman Theatre.pdf
Heathers Symbols for Gerald Freedman Theatre.pdfHeathers Symbols for Gerald Freedman Theatre.pdf
Heathers Symbols for Gerald Freedman Theatre.pdfLizShek
 
Communicative Grammar English .pnnnnkkptx
Communicative Grammar English .pnnnnkkptxCommunicative Grammar English .pnnnnkkptx
Communicative Grammar English .pnnnnkkptxRawalRafiqLeghari
 
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdf
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdfPAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdf
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdfssuser799b33
 

Recently uploaded (20)

Bring Your Office Interiors Back to Life The Enchantment of Personalized Wall...
Bring Your Office Interiors Back to Life The Enchantment of Personalized Wall...Bring Your Office Interiors Back to Life The Enchantment of Personalized Wall...
Bring Your Office Interiors Back to Life The Enchantment of Personalized Wall...
 
acervus process book no cover--character
acervus process book no cover--characteracervus process book no cover--character
acervus process book no cover--character
 
impact of packaging on consumer buying behaviour project report pdf.pdf
impact of packaging on consumer buying behaviour project  report pdf.pdfimpact of packaging on consumer buying behaviour project  report pdf.pdf
impact of packaging on consumer buying behaviour project report pdf.pdf
 
Carpentry 7-8 explorartory (Week 3).pptx
Carpentry 7-8 explorartory (Week 3).pptxCarpentry 7-8 explorartory (Week 3).pptx
Carpentry 7-8 explorartory (Week 3).pptx
 
Mother Courage and Her Children Layouts.pdf
Mother Courage and Her Children Layouts.pdfMother Courage and Her Children Layouts.pdf
Mother Courage and Her Children Layouts.pdf
 
creating my own logo and icon.pptx
creating my own logo and icon.pptxcreating my own logo and icon.pptx
creating my own logo and icon.pptx
 
Presentation on "Gothic Architecher".pptx
Presentation on "Gothic Architecher".pptxPresentation on "Gothic Architecher".pptx
Presentation on "Gothic Architecher".pptx
 
Studio Surfaced - Textile Design Studio based out of Delhi NCR
Studio Surfaced - Textile Design Studio based out of Delhi NCRStudio Surfaced - Textile Design Studio based out of Delhi NCR
Studio Surfaced - Textile Design Studio based out of Delhi NCR
 
Land Management and sourcing land for sustainable Urban Development.
Land Management and sourcing land for sustainable Urban Development.Land Management and sourcing land for sustainable Urban Development.
Land Management and sourcing land for sustainable Urban Development.
 
Amadeus Hang and Cable Layouts UNCSA.pdf
Amadeus Hang and Cable Layouts UNCSA.pdfAmadeus Hang and Cable Layouts UNCSA.pdf
Amadeus Hang and Cable Layouts UNCSA.pdf
 
Types of Drafting in Construction Projects
Types of Drafting in Construction ProjectsTypes of Drafting in Construction Projects
Types of Drafting in Construction Projects
 
December 2023 Issue - Fnewsmagazine SAIC
December 2023 Issue - Fnewsmagazine SAICDecember 2023 Issue - Fnewsmagazine SAIC
December 2023 Issue - Fnewsmagazine SAIC
 
Preposition for grade 12th Vietnamese student
Preposition for grade 12th Vietnamese studentPreposition for grade 12th Vietnamese student
Preposition for grade 12th Vietnamese student
 
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptx
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptxAl-Aqsa Mosque History Thesis Defense by Slidesgo.pptx
Al-Aqsa Mosque History Thesis Defense by Slidesgo.pptx
 
Before and After Wheelchair Accessible Whole Home Remodel.pptx
Before and After Wheelchair Accessible Whole Home Remodel.pptxBefore and After Wheelchair Accessible Whole Home Remodel.pptx
Before and After Wheelchair Accessible Whole Home Remodel.pptx
 
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdf
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdfASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdf
ASIF KHAN-LANDSCAPE-DESIGN PORTFOLIO 2024 f.pdf
 
homescreen revamp homescreen revamphomescreen revamp
homescreen revamp homescreen revamphomescreen revamphomescreen revamp homescreen revamphomescreen revamp
homescreen revamp homescreen revamphomescreen revamp
 
Heathers Symbols for Gerald Freedman Theatre.pdf
Heathers Symbols for Gerald Freedman Theatre.pdfHeathers Symbols for Gerald Freedman Theatre.pdf
Heathers Symbols for Gerald Freedman Theatre.pdf
 
Communicative Grammar English .pnnnnkkptx
Communicative Grammar English .pnnnnkkptxCommunicative Grammar English .pnnnnkkptx
Communicative Grammar English .pnnnnkkptx
 
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdf
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdfPAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdf
PAGE ONE PAGE TWO PAGE THREE PAGE FOUR.pdf
 

UI vs UX workshop

  • 2. UI / UX Workshop Mobile Track Design
  • 3. - Understanding UI vs. UX UI is the user interface. This comprises everything a user can see and touch, such as menu options, buttons, text, layouts, navigation elements, sharing options, etc. UX is why you made that change to affect how the user feels and behaves. The user experience is an umbrella term for the user’s overall experience with the product: what they liked about it, how easily they accomplished their goals, moments of delight and frustration, etc. The UI is the paint, the canvas, the types of strokes and colors. The UX is the wonder you feel when you see the girl in the pearl earring.
  • 7. - Wireframing Who Uses Wireframes? In short, anyone involved in the product – in any capacity.Although designers, developers, and product managers typically create and use wireframes the most in their daily work, many people bene t from wireframes. Graphic Designers use wireframes to push the user interface (UI) development process. It can inspire the designer, resulting in a more uid creative process. And is ultimately used to create graphic mockups, interactive prototypes, and the nal design. Typically, a combination of sketching, storyboarding and wireframing in low or high- delity are used to achieve this. Developers use wireframes to get a more tangible grasp of the site’s functionality. It gives the developer a clear picture of the elements that they will need to code.
  • 8. -Wireframing Why Should Anyone Use Wireframes? Wireframes are visual representations of an interface, used to communicate the following details to get everyone on the same page: ● CStructure – How will the pieces of this site be put together? ● ontent – What will be displayed on the site? ● Informational hierarchy – How is this information organized and displayed? ● Functionality – How will this interface work?
  • 9. - UI / UX Mistakes 1. Poor UI/UX Design 2. Implementing too many features 3. Neglecting Target Audience 4. Tiring Tutorials 5. Making Things Difficult 6. White Space Is Missing 7. Sticking To Sign In 8. Trying To Copy Other Apps 9. Redesigning Without Proper Feedback 10. Ignoring Social Media Link 11. Not Informing The Happenings To User 12. Wrong Estimates Of Updates
  • 10. - Poor UI/UX Design This is the biggest mistake a designer can commit during the creation stage. UI takes care of the placement of elements in the mobile app which not only affects the performance but also UX. While designing, place yourself in the user’s shoes and then decide about the design interface that will go for the app. A simple and interactive UI helps to engage users better as they can easily navigate across and use all the features.
  • 11. - Implementing too many features Implementing too many features in your app can make your app sluggish and lower the overall performance. Having several features can consume a lot of memory and thus affect the output of the app.
  • 12. - Neglecting Target Audience Ignoring target audience will lead you on the path of failure. Yes, target audience is even more significant than the app design concept. Your extraordinary plans won’t work unless you are clear whom you will be catering to.
  • 13. - Tiring Tutorials No doubt tutorials are important to guide a person with proper explanation, but most tutorials are a burden than a blessing. They are overloaded with excessive information and it’s just like beating about the bush with the subject.
  • 14. - Making Things Difficult For mobile app designing, the KISS rule works very well. Yes, Keep It Short and Simple. Don’t complicate things as it will create confusion which will meddle in the working of the app.
  • 15. - White Space Is Missing White space gives a breathing space to the page. Although taken for granted, but it adds a balance to your design and its elements. Don’t get so driven by other elements that you forget to include white space in your design.

Editor's Notes

  1. https://onepotprojects.com/ux-design-my-workflow-tools-and-resources-dd752776f403#.dcmlur9pd
  2. https://think360studio.com/15-ui-ux-mistakes-that-can-ruin-your-mobile-app/