4th Sem, AI

314005: Ui or Ux Design Syllabus for Artificial Intelligence 4th Sem K Scheme MSBTE PDF

Ui or Ux Design detailed Syllabus for Artificial Intelligence (AI), K scheme PDF has been taken from the MSBTE official website and presented for the diploma students. For Subject Code, Subject Name, Lectures, Tutorial, Practical/Drawing, Credits, Theory (Max & Min) Marks, Practical (Max & Min) Marks, Total Marks, and other information, do visit full semester subjects post given below.

For all other MSBTE Artificial Intelligence 4th Sem K Scheme Syllabus PDF, do visit MSBTE Artificial Intelligence 4th Sem K Scheme Syllabus PDF Subjects. The detailed Syllabus for ui or ux design is as follows.

Rationale

For the complete Syllabus, results, class timetable, and many other features kindly download the iStudy App
It is a lightweight, easy to use, no images, and no pdfs platform to make students’s lives easier.
Get it on Google Play.

Course Outcomes:

Students will be able to achieve & demonstrate the following COs on completion of course based learning

  1. Explain design thinking concept.
  2. Interpret user requirements.
  3. Select appropriate visual design for given problem.
  4. Create interactions using design tool.
  5. Create innovative design prototype for given applications.

Unit I

Design Thinking Fundamentals 1.1 Introduction to Design thinking – Concept, Purpose, 5 stages of design thinking – Empathize, Define, Ideate, Prototype, Test 1.2 Introduction to User Interface / User Experience (UI/UX) – Definition of Design with respect to digital media, User Interface, User experience, Difference between UI and UX. History of UX. Need of UI and UX

Suggested Learning Pedagogie
Chalk-Board Demonstratio Presentations Flipped Classroom

Unit II

For the complete Syllabus, results, class timetable, and many other features kindly download the iStudy App
It is a lightweight, easy to use, no images, and no pdfs platform to make students’s lives easier.
Get it on Google Play.

Unit III

User Interface Design 3.1 Storyboarding, User journey mapping 3.2 Gestalt principles of design – Aesthetics in UI design – Using Light, Color and Contrast Effectively in UI Design 3.3 Introduction to any freeware design tool such as Figma 3.4 Visual Communication Design – effective visual communication for graphical user interface

Suggested Learning Pedagogie
Chalk-Board Demonstratio Hands-on Presentations

Unit IV

User Experience Design Tool 4.1 Introduction to User Experience design 4.2 UX design open source tool such as – Figma features – Navigations, interactions, Buttons Creating library 4.3 Gamification, micro-animation 4.4 Creating visual identity of the project – design system, design theme

Suggested Learning Pedagogie
Chalk-Board Demonstratio Hands-on Presentations

Unit V

For the complete Syllabus, results, class timetable, and many other features kindly download the iStudy App
It is a lightweight, easy to use, no images, and no pdfs platform to make students’s lives easier.
Get it on Google Play.

List of Experiments:

  1. *Use Design tool for user requirement collection and analysis Visit minimum 5 websites/ Apps of the particular category. Identify problems in overall navigation, look and feel of websites, relevance of the information. Record all findings using Design tool 4 C C
  2. Use Design tool for user requirement collection and analysis of various interfaces such as kiosks Visit minimum 5 interfaces. Identify problems in overall navigation, look and feel of the interface, relevance of the information. Record all findings using Design tool 4 C C
  3. *Recreate a given user interface using any open source design tool (For example, to recreate the first screen of personal mobile phone etc.) 4 C C C
  4. * Create grid system for the given screen using any design tool (For example dashboard of particular application/ welcome screen of any blog portal etc.) 4 C C C
  5. *Design given user interface using various components such as auto-layouts in the design tool (For example, design sample login page/ design registration form etc.) 4 C C C C
  6. *Use horizontal scrolling to create pages for given website/ App (For example, page(s) in social media Apps/ tourism related webpage(s) ) 4 C
  7. *Use vertical scrolling for a given website/ App (For example, Retail website/App or food ordering Apps etc.) 4 C
  8. Recreate given website for UI design, color, images, interactions, menu 4 C C C
  9. *Create navigations for the given website/ App (For example, create navigation in App using bottom menu etc.) 4 C
  10. Design a quiz for given user interface (For example, quiz for LMS / government web site / retail web sites etc.) 4 C
  11. Create any two gamification effects for given user interface in given scenario (For example, racing effect etc.) 4 C C
  12. Create gamification for task completion in website such as LMS/ retail website/ banking website (For example, popping up effect/ releasing balloons in the air etc. once a task is completed) 4 C C C
  13. Create any five micro animations for the given user interface in given scenario (For example, progress bar effect/ waitin for reply or responce effect/ status bar/ welcome page or opening page animatio etc.) 4 C C
  14. *Create prototyping with different interactions – tab, click, hover, delay. for the given user interface 4 C C
  15. Convert created prototype in HTML page(s) 4 C

Self Learning

Micro Project

  • The micro project has to be Industry Application Based, Internet-based, Workshop-based, Laboratory-based Field-based as suggested by Teacher:
    1. Prepare a prototype for online blog:
      1. Prepare a competitive analysis of similar website
      2. Define user persona and prepare user journey mapping using any design tool
      3. Construct prototype using – navigation, interaction, frames in design tool
      4. Validate the prototype by checking navigation and conditions given
      5. Convert the design prototype into HTML code
    2. Reconstruct given user interface such as kiosk system:
      1. Observe the given user interface
      2. Identify improvement in the user interface in terms of – look and feel, navigation, interactions
      3. Prepare affinity mapping using design tool
      4. Reconstruct the given interface using various components in design tool
    3. Prepare a prototype for food ordering App:
      1. Prepare a competitive analysis of similar Apps
      2. Define user persona and prepare user journey mapping using any design tool
      3. Construct prototype using – navigation, interaction, frames in design tool
      4. Validate the prototype by checking navigation and conditions given
    4. Rebuild smart TV user interface layout
      1. Visit existing interfaces of smart television
      2. Record findings related to color scheme, theme, look and feel, location on display of existing interfaces
      3. Record minimum 10 different user reviews regarding the smart television user interface (chose user from dif backgrounds)
      4. Record improvements in look, navigation, and interactions
      5. Redefine user persona for existing interface
      6. Rebuild the interface prototype using design tool

Assignment

  1. Prepare a case-study report –
    1. Identify any dedicated interface such as Automated deposit cum Withdrawal machine.
    2. Perform a user requirement analysis through any research method (e.g. Interview/ Questionnaire etc.).
    3. Define user persona for the same.
    4. Prepare a low fidelity prototype for it.
  2. Prepare user storyboard and user journey mapping for given user interface –
    1. Identify user requirements .
    2. Perform a user requirement through research methods (e.g. Interview/ Questionnaire etc.).
    3. Define user persona for the same.
    4. Prepare a user journey mapping for the same.
    5. Prepare a storyboard for the user interface.
  3. Prepare low, medium, and high fidelity prototype for given user interface –
    1. Identify user interface.
    2. Collect user requirements by any two methods (e.g. Personal observation/ expert review etc.)
    3. Define user persona for the same.
    4. Prepare a low fidelity prototype on paper for the same.

Other

  • Following are some suggestive self-learning topics or any relevant topics suggested by the Teacher:
    1. Prepare a feature-based detailed report of similar types of website/portal(such as Flight/ bus Reservation web MIS / e-commerce web sites / educational institutions websites etc).
    2. Prepare affinity mapping in any design tool (e.g. FigJam) for user requirements in given domain of the proje
    3. Define user persona and perform requirements mapping using design tools in any of the following category booking kiosk/ Online examination system / Quiz App.
    4. Prepare user journey mapping for given scenario in the given project
    5. Prepare low, medium, and high-fidelity prototypes for a given scenario using any design tool.
    6. Prepare a library/repository of design components using any design tool like Figma.
    7. Reconstruct any ticket booking website to address improvements in look and feel, ease of use within it.

Laboratory Equipment

For the complete Syllabus, results, class timetable, and many other features kindly download the iStudy App
It is a lightweight, easy to use, no images, and no pdfs platform to make students’s lives easier.
Get it on Google Play.

Learning Materials

  1. Jesse James Garrett The Elements of User Experience: User-Centered Design for the Web and Beyond New Riders Publishing, 201 West 10 Street, Indianapolis, IN 46290 800-5 5914 ISBN:978-0-321-68368-7
  2. Falk Uebernickel, Li Jiang, Walter Brenner, Britta Pukall, Therese Naef Design Thinking: The Handbook World Scientific Publishing Co Pte No.16, South West Boag Road T. Na Chennai 600017, INDIA ISBN-10: 9811203504 ISBN-13: 978-9811203503
  3. Fabio Staiano Designing and Prototyping Interfaces with Figma Packt Publishing Ltd, Grosvenor Ho 11 St Paul’s Square, Birmingham, B 1RB ISBN-10: 180056418X ISBN-13: 978-1800564183
  4. Kilian Langenfeld Design Thinking for Beginners Personal Growth Hackers ISBN-10: 3967160629 ISBN-13: 978-3967160628

Learning Websites

  1. https://aim.gov.in/pdf/Design_Thinking.pdf Design thinking phases and learning resources
  2. https://www.ideou.com/pages/design-thinking-resources Design thinking resources
  3. https://www.figma.com/resource-library/what-is-design-thinki ng/ Design thinking and its stages
  4. https://www.figma.com/resource-library/what-is-ui-design/ Key elements of UI design
  5. https://youtu.be/-wzNTPXVIyM?si=zET5z3GpIPl-cAry User Experience and research methods
  6. https://youtu.be/XT152i5asdQ?si=jPdLFFExnaZO8NRs User Experience and research methods
  7. https://usabilitypost.com/2008/08/14/using-light-color-and-c ontrast-effectively-in-ui-design/ Using Light, Color and Contra Effectively in UI Design
  8. http://web.cs.wpi.edu/~matt/courses/cs563/talks/smartin/int_ design.html Effective Visual Communicati for Graphical User Interfaces
  9. https://youtu.be/Y9ixRTTx5iU?si=vSCsbCr6gXD5eG-n Visual Communication Desig
  10. https://youtu.be/K-DRTBMnzm8?si=DaUPM4iLW2CU3oSU Low fidelity design
  11. https://youtu.be/KCYLE78w074?si=xZsvSnO9qx7iVE2S High fidelity design
  12. www.figma.com Figma – Design Tools – Figma FigJam (Freeware)
  13. https://www.figma.com/resource-library/design-basics/ Design basics using Figma (Freeware)
  14. https://wireframe.cc/ Single-page, public wireframe without user account available free version.
  15. https://drive.google.com/file/d/1Od0G1mtlRHz5LkxgT3GPr7wDEIw 7GV05/view Design Thinking and user experience research (Notes by NPTEL)
  16. https://www.mindmeister.com/ Collaborative mind mapping t
  17. https://miro.com/ UX tool
  18. https://www.hotjar.com/ UIUX tool

For detail Syllabus of all other subjects of Artificial Intelligence, K scheme do visit Artificial Intelligence 4th Sem Syllabus for K scheme.

For all Artificial Intelligence results, visit MSBTE Artificial Intelligence all semester results direct links.

View All Post

Leave a Reply

Your email address will not be published. Required fields are marked *

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.