Student ID: (BC210401380)

CS408 – Human Computer Interaction

Assignment #1

Question No #1

As you learn, colors are divided into three categories i.e. primary colors, secondary colors and
tertiary colors. There are different colors in column A in the below mentioned table. You are
required to write the appropriate color category against each color in the column B.

Column A (Colors) Column B (Category)

Yellow-Orange Tertiary

Purple, Green Secondary

Blue Primary

Orange Secondary

Red-Purple Tertiary

Question No #2

Now, you are required to create your account on these tools and paste the screenshots of the main
pages of these tools separately. We will mark this question based on your email address and user
name, which will be mentioned on the main pages of these tools.
For Figma:

For Webflow:
 Question No #3
Sr# Design Figma (https://www.figma.com/)
Principle
1 Visibility The visibility of a layer in the
Layers panel can be toggled here.
A hidden layer's position can still
be changed, and its characteristics
can be tweaked. The Eye icon
indicates the visibility of layers
(and characteristics). To share with
users, there is just one Figma
component. This implies there will
be just one component to maintain,
one component for designers to
utilise, and only one component to
locate in the components panel and
instance menus.
2 Consistency This includes deciding on a
product's colours, typefaces, and
tone that may be used in a variety
of layouts and interfaces.
Customers become acclimated to
certain interface objects, including
their placement on a screen. As a
result, the experience gets more
familiar, and your product
becomes easier to use.
Now, you are required to map only these two design principles i.e. Visibility and Consistency on
the following mentioned tools and write your answers in the given table.
Webflow (https://webflow.com/)
The most adaptable technique to
expose or hide features in a
dynamic design and generate
various designs for different
Collection items depending on
different criteria is through
visibility. Unlike filters, which
determine which Collection items
appear in a Collection list,
conditions determine when any
element (static or dynamic)
appears in a Collection list or
Collection page.
Growing pains are unavoidable
for successful startups and
businesses. Maintaining a
manageable design system that
keeps a brand constant as it scales
is a typical difficulty that is
starting to appear more frequently
in the IT industry. It provides a
foundation for enterprises to build
more quickly, consistently, and to
a higher standard.