Scribd
Upload
16 views

UI & UX Course Syllabus 2024

Webskitters Academy offers a comprehensive online UI/UX design course aimed at equipping students with essential skills for a successful career in the growing industry. The course covers various modules, including design tools, wireframing, prototyping, and advanced design techniques, alongside practical projects to enhance learning. Students will develop both technical and soft skills necessary for effective UI/UX design and collaboration in professional environments.

Uploaded by

ihyvini.xo
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
16 views

UI & UX Course Syllabus 2024

Webskitters Academy offers a comprehensive online UI/UX design course aimed at equipping students with essential skills for a successful career in the growing industry. The course covers various modules, including design tools, wireframing, prototyping, and advanced design techniques, alongside practical projects to enhance learning. Students will develop both technical and soft skills necessary for effective UI/UX design and collaboration in professional environments.

Uploaded by

ihyvini.xo
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

User Interface (UI) & User Experience (UX) Design Course Syllabus

Best UI/UX Design Online Training Available

Join the top-notch UI/UX design online course available with Webskitters Academy and
explore tremendous placement and career opportunities.

UI/UX Design Course

Webskitters Academy presents a wonderful range of career prospects to its candidates.


Offering reliable and noteworthy UI/UX Design online training, the institute aims to help
its students to gain in-depth knowledge of the industry. Promoting a healthy learning
environment, the faculties ensure to develop exclusive skills among the candidates. With
our top-notch online training, we prepare you for the market and help you to experience
excellent career prospects.

Objectives

UI/UX design is a tremendously growing industry, with its influence expanding in different
sectors of the virtual world. With its design-centric approach, UI/UX designers can build a
user interface and user experience offering practicality and easy navigation to the users.
From discussing the strategies to developing the information architecture, the UI/UX
designers need to create a compelling, effective and seamless experience for smooth user
interaction. Through our online course, we intend to help the young aspirants to gain
unprecedented opportunities in their future endeavours.

Pre-Requisites
Basic understanding of the Computer System.

Course Modules

Note: The entirety of this course will be taught through actual practice.
Module 1: Introduction to UI/UX & the tools used for its design. Basic fundamentals of Web
Design and App Design are also to be taught. Softwares to be used are Photoshop, Figma &
XD.
Module 2: Introduction to Adobe Photoshop.
(Note:- It is important to learn photoshop first before the usage of any other
Tools meant for design)

Module 3: Introduction to wireframing.


a. Why & when do we need a wireframe ?
b. How to draw a wireframe ?

Module 4: Font, Typeface, Color, Dummy Text & Icon Introduction.


a. What is a typeface ? How to use them.
b. What is font ? Which fonts to use and when ?
c. Colors. What do they mean ? Which color to use and when.
d. What is an icon ? What do they mean ?
e. What is a dummy text ?

Module 5: Introduction to Figma.


a. What is figma ? How to use it.
b. Working with existing UI kits.
c. Prototyping. What is it & how to do it ?
d. A recap of the previous modules through figma.

Module 6: How to design User Interface using User Experience.


a. Detailed knowledge of UI & UX.

Module 7: Class Project 01: Prototyping a Website – Introduction


a. Prototyping & adding interactivity.
b. How to create a Popup Modal or popup box.

Module 8: Class Project 02: Symbol & repeat grids.


a. How to make & use symbols.
b. Using the repeat grid.
c. Updating symbols & problems with using repeat grids.
d. Prototype Trick to save time.
e. Navigation tricks & tips.

Module 9: Class Project 03: Prototyping an App – Introduction.


a. Make an APP version of your project.
b. How to use the App on iPhone & Android.
c. How to fix the position.

Module 10: Introduction to Adobe Illustrator & Adobe XD.


a. How to use Adobe Illustrator & Adobe XD.
b. Back and forth with Photoshop, Illustrator, XD & Figma.
Module 11: Wireframe feedback.
a. Sharing Wireframes for comments.

Module 12: Flowchart, Userflow & Taskflow.

Module 13: Class Project 04 :

a. Mood Boards & resources for Hi fidelity UI design.


b. How to create a 12 Column Grid.

Module 14: Advanced Color Theory.


a. Color Psychology.
b. Working with colors.
c. Tricks for using colors.
d. How to create gradients.

Module 15: Typeface & Fonts Advanced.


a. Use Web safe fonts or iOS or Android specific fonts.
b. How to use Character Styles .
c. Font & Text tips tricks.
d. Adding our first Plugin LoremIpsum (Dummy Text) to figma.
e. Creating realistic buttons with paste properties.

Module 16: Class Project 05: Drawing.


a. How to draw your own custom icons.
b. Working with stokes & lines.
c. Learn to draw with the pen tool.
d. Drawing practise with the pen tool.

Module 17: Class Project 06


a. Working with different tools.
b. The pros & cons for working with images inside Figma, etc.
c. Working with images and CC Library connection.
d. Stock connection to find similar image for project.
e. Free images to use in your figma mockups – Unsplash, Pexels, Freeimage,
etc.
f. Masking & Opacity & Blurring background images.
g. Production Video – Infographic.

Module 18: Class Project 07


a. Hidden features for Repeat Grid.
b. Plugin - Content Generator.
c. Plugin - UI Faces adding random profile photos.
d. Plugin - PhotoSplash automatically import Unspash images.
e. Plugin - Copy Cat or Mimic to style and images from a site.
f. Advanced Asset Panel tricks.
g. Advanced Symbol Tricks & Tips.
h. What are UI micro interactions.
i. Button grow or full screen image micro interaction.
j. Animated Image Gallery with micro interactions.
k. Full vector change micro interaction.

Module 19: Class Project 08


a. Time delay transitions.
b. How to create a popup menu or modal.
c. Animated mobile side nav for burger menu.
d. Advanced prototyping using buttons & dropdown menus.
e. How to use the drag transition.
f. How to make a number ticker scroll using masks.
g. How to add Alexa style voice commands.

Module 20: Class Project 09


a. What is user testing.
b. How to run an unmoderated UX User Test.

Module 21: Class Project 10


a. Mocking up your designs in suit on a real phone.
b. Advanced micro interactions & prototyping.
c. How to add animation.
d. How to export images & code for developers.
e. How to export code for engineers using Design Specs.

Module 22: Class Project 11

The skills that Webskitters Academy delivers you to become the best UI/UX designer
are the following:

Technical Skills:

a. UX ENGINEERING
b. UI DEVELOPMENT
c. AGILE DESIGN
d. TYPOGRAPHY
e. COLOUR THEORY

Soft Skills:

a. Quick solution-giving approach.


b. Excellent communication skills.
c. Ability to work in a team.
d. Creative Mentality.
e. Time management.

You might also like