Course Code Course Name L T P S Cr

CSE- 336/436 Fundamentals of UX and UI Lab 0 0 2 0 1.0

Prepared By Ms. Deepika Sharma
Department AIT(CSE)
Institute APEX INSTITUTE OF TECHNOLOGY (AIT)
Pre-requisite Basic knowledge of User interface and Graphic Designing.
Objective 1. To provide the practical knowledge of UX and UI and it’s different tools to the students.
2.To provide the knowledge about different techniques for building user interfaces to the
students.
3. To provide the students about how the user's interaction can be made as simple and
efficient as possible, in terms of accomplishing user goals (user-centered design).
Total labs(s) 12

List of Experiments
Unit-1
1 Create your account on hotgloo.com(like mine https://deepikasharma.hotgloo.io/main) to use wireframe
here().
2 Suppose you are assigned a mobile app project to be completed within a month having following
parameters : -

(a) User friendly display with Registration page (Username, Password, Register button).
(b) Login page having same parameters.
Now, create a flowchart for the design and design it using any Interface creator.

3 Create a flowchart for project having following requirements:-

(a) 4 teams – Designing_Team, Production_Team, Programming_Team, Testing_Team.

(b) Deadline of 1 month.
(c) Create a design for payment gateway for an app.

Unit-2

4 Create a flowchart for a Library management system and design Home page, Book_issue page for the
library management.

5 Create account on Invision(Like mine cuchd.invisionapp.com) to understand various designing

prototypes in designing for Payment_Gateway.
6 Create a whatsapp design which has more improvements over the current design.

7 Test whatsapp design by implementing various test cases an tools provided by invision.

Unit-3
8 Design Grid Layout for Gallery and FrameLayout to show an image and video in mobile smart device.
9 Create an SRS(Software requirement specification) or a Paper prototype with a flowchart for the following:
Page 1 of 2
 -
(a) Client’s requirements.
(b) Team Requirements.
(c) Team members requirements.
(d) Time requirements.
(e) Technology requirements.
(f) Test cases.
(g) Final Implementation Details.
(h) Delivery of the Product to the client.
(i) Client feedback to Product.
(j) Beta Release Survey.
(k) Post release survey.
(l) Maintenance.

Among your classmates, you can choose your Team_Members, Team_Leader, Tester and users to assign the
respective roles.
10 Create a app design related to the following resources to work as an user experience designer:-
Choose a project you want to work upon having following steps to be taken into consideration: -
(a) Analysis After you choose a project, you will start your design by doing the following:
(b) User analysis. Identify the characteristics of your user population, as we discussed in lecture. If you
have multiple user classes, identify each one.
(c) Task analysis. Determine the tasks of the problem you've chosen, analyze their characteristics, and
answer the general questions about tasks we asked in lecture. Think about other questions you
should ask that might be relevant to your particular domain. You should find and analyze at least 3
high-level tasks. For example, in a recipe site, the most central, interesting tasks might be editing a
recipe , finding a recipe and using a recipe (to actually cook). If you can't find 3 interesting tasks,
then your problem may be too small to serve as a good project, and you should rethink it. Every task
should have a goal and subtasks. Some tasks may also need preconditions, exceptions,time
constraints, and frequency of use.
(d) Domain analysis. Determine the important entities and relationships of your problem domain, and
show them in a diagram (a problem object model or entity-relationship diagram). Include
multiplicities where important. Include text that defines entities or relations that aren't obvious.
To gather information for the user and task analysis, you must talk with at least 3 representative users who
face the problem you are tackling (at least 1 from each user class, if you have multiple user classes). If
possible, observe them dealing with the problem in their real work environment. When you write up your
analysis, you must give us evidence that you interviewed and observed people, but don't provide a narrative
of these sessions. Instead, offer your conclusions, and justify them when you can by referring to
observations. For example, "grocery shoppers may be distracted by children; one mother was repeatedly
harrassed by her son to buy some candy." Also, don't identify the users you interviewed by name, unless
you get their permission to do so.

Note : - You can include group members into it also(One can design, One can test and if possible one can
code also).

COURSE OUTCOMES
At the end of the course students will able to: -

1. Design an effective interface.

2. Create an effective design for an app/website.
Page 2 of 2
 3. Use different techniques for evaluating and measuring interface usability, predictive evaluation, and user
testing.

Text Book:
 Norman, Donald A. The Design of Everyday Things. Basic Books, 2002. ISBN: 9780465067107.
 Nielsen, Jakob. Usability Engineering. Morgan Kaufmann, 1993. ISBN: 9780125184069.

 Mullet, Kevin, and Darrell Sano. Designing Visual Interfaces: Communication Oriented Techniques. Prentice
Hall, 1994. ISBN: 9780133033892.

Page 3 of 2