Human Computer Interaction

1. Good website design
/
BadWebsite design

2. Zahid Hussain
Roll #: F18BSCS00248
Subject: Human Computer Interaction
Global institute Lahore

3.  Incoherent design choices
 Key information that is buried
 Difficult navigational structures
 Unconventional colors
 Low-quality graphics
 Unreadable fonts
 A lack of mobile compatibility

4.  The website is designed for 200 percent
zoom, and clicking on the book covers on the
homepage does nothing.
 As a matter of fact, there’s a surprise word
doc that readers can download containing a
list of Children’s Choice Award Nominations.
 We simply do not understand the point of
keeping a downloadable word document
when it could easily have been just another
page!

5.  This website simply does not work on mobile.
Statutory warning – do not go in there if you
are having a bad day.

6.  This website ushers in brutality in website
design. It looks and feels far from professional,
and the content is simply below par.
 It is evident that except the website designer,
everyone knows the importance of a “Title” tag
in SEO.
 The worst issue is that the registration form for
the upcoming conference is a PDF. So you
cannot edit it online.You need to download it
and mail it.

7.  The name surely does grab a lot of eyeballs,
but the website will make your senses scream
in physical pain.
 They may be thinking about waking people
up from the slurry of conspiracies, but
honestly, the designers should have woken
themselves up completely before publishing
such a worst website.

8.  The color combination makes you wish that you
had your RayBans on right now.
 The grey and black interspersed with bright red
and white makes us wonder if the designer was
colorblind.
 This website has no sense of minimalism.
 The pages are overcrowded with content and
low-res pictures, which make browsing a pain.
 Also, the logo on the main page does not match
the logo on the rest of the pages.

9.  Make it easy for visitors to find what
they’re looking for
 Choose conventional color, design, and
navigation schemes
 Don’t rely too much on images and
animations
 Make your audience the top priority
 Work with a team of professionals

10.  It's easy to consume.There is much debate on
whether short or long homepages work better. If you
choose to do the latter, you need to make it easy to
scroll and read -- and that's exactly what this site
does. It almost acts like a story.
 There's great use of contrast and positioning with the
primary calls-to-action -- it's clear what the company
wants you to convert on when you arrive.
 The copy used in the calls-to-action "Get Started for
Free" is very compelling.
 FreshBooks uses customer testimonials on the
homepage to tell real-world stories of why to use the
product.

11.  It's a super simple design with a strong, no-
jargon headline and sub-headline.
 The homepage gives off a secure but easy-
going vibe, which is important for a product
that handles financial information.
 It also contains simple, direct, and compelling
call-to-action copy: "Sign up free."The CTA
design is also brilliant -- the secured lock icon
hits home the safety message once again.

12.  Dropbox carries over its simple design and
branding. It includes only what is important: A
large, relevant image with supporting copy, and
a "Try free for 30 days" call-to-action button
 Dropbox's homepage and website is the
ultimate example of simplicity. It limits its use of
copy and visuals and embraces whitespace.
 Its sub-headline is simple, yet powerful: "The
secure file sharing and storage solution that
employees and IT admins trust." No need to
decode jargon to figure out what Dropbox really
does.

13.  Combined with great photography, the
headline "Brisket. 18 years to master.Yours to
savor." sounds like an experience worth
trying.
 The parallax scrolling guides you on a tour
through the services, menu, and people
having a great time -- a great use of this
popular design trend.

14.  This homepage uses a combination of rich,
muted colors in the video and its signature
bright green and white highlights to make
conversion paths stand out.
 Following a simple headline ("Remember
Everything"), the eye path then leads you to its
call-to-action, "Sign Up For Free."
 Evernote also offers a one-click signup process
through Google to help visitors save even more
time.