Layout and filling white space critiquing
Group: 9
Student names: Alexander Sennhauser, Coralie Reissner, Beatrice
Forster
Date: 9.5.07
Content richness & completeness
(weight: 16.5/40)
Identify at least 3 elements that can be added
to the GUI to enrich the content.
1) A small introduction could help
getting new users. If a user visits the site for the first time, it is useful
if he or she can see directly what the site can be used for.
2) There is no login on this site. If
for example a user would like to buy a ticket, she would have to register all
her data first. With a login, this data could be stored for the next time.
Also, some personal information about herself could be displayed once she
logged in.
3) If a user visits the site for the
first time, some indication that the site is actually used by many people could
be given. We thought about two things:
a. A link to some kind of forum could be
placed in the menu
b. A picture gallery could be
implemented (where other users can put a picture of their trip and some short
comment about it). Some (for example 3) pictures should be placed on the main
page, including a link leading to the gallery.
4) The separators they used have sharp
corners (menu, title picture, find-trip-box). Rounder
corners would not actually fill the page more, but it would lead to a less
formal, but trendier design.
What would you do differently?
Apart from the things
mentioned above, we also would change in the Hottest Destinations the
proportion of the picture size versus the size of the description text. As it
is now, it makes almost an impression of advertisements (maybe because the
pictures look more like books than like holidays). If some title was added
(like World Cup in
The title of the page
figures in the uppermost left corner. Usually, we would have expected a logo
there. We therefore decided to use a yellow logo (a sunflower) and put the
title on the right part of the sky-picture, just above the slogan.
Also, the title: “make
your choice” for the search field in the center seems to be a bit
misleading, since the user does not directly have to make a choice yet. He can
first browse different trips and can make a choice afterwards. We have
therefore changed the title to “find your trip”.
Empty space (weight: 10/40)
Give some arguments for why users might not
appreciate the empty space?
If a page is as empty
as this one, a user has almost the same problem as with a page that is
overfilled: It is difficult to locate the important things. A user that gets
the first time to the page does not know where she should look at, since the
only eye-catching things are the title and the pictures at the bottom, which are
in fact not the most important ones.
The usage of some colored
boxes around items might help to group items – For example the text
“You are looking for a trip in
What would you do to improve the content
structure (organization)?
The alignment of the white
part is not very appealing because the uppermost part is flowing around in the
middle and towards the right side while the middle part is centered and the
titles are left-aligned. This should be changed and at least the titles, the
middle and the bottom part should be aligned equally (the best choice is
left-aligned). The uppermost part does not necessarily have to be aligned, but
the sentences should be grouped closer together and the left-most one of them
should be at the left border to keep the alignment consistent. After all, they
are just meant to explain the goal of the website to the user (we assume that
those aren’t links to other parts of the website).
We recommend the usage of
colors or boxes in order to form groups of elements. This helps to draw
attention to the important elements (like welcome, find a trip, hottest
destinations, and the login (new element)).
Layout design (weight: 13.5/40)
Identify at least three layout related
problems.
1) The 3 questions: “You are
looking for a trip in
2) (Color) Contrast is provided only for
distinguishing the title, the logo and the menu from the main part. However,
inside the main part (white), more color contrast could be provided to
distinguish the 3 parts (introduction, find trip and suggestions)
3) As we mentioned above (structure /
organization), there is no consistent alignment in the white, center part. We
recommend an align-left for all elements.
4) The button to find a trip (get
Results) does look completely different to the “click’n’leave”
links that figure just next to the suggestions. In order to have a more
consistency, it might be a good idea to repeat the same type of button/link at
all those places (only the layout should correspond, not the names)
5) The layout of the search field in the
center is not very good, there are 4 search fields on the left plus the button
and only one field is placed on the right.
Based on your previous observations, what
would you do differently for Layout Design?
In our design, we added an
introduction. This replaces the 3 questions and indirectly solves their
proximity / grouping problem.
Also, we used boxes and separation lines to group different elements: boxes for
menu, login, gallery and lines for the separation between the three
center-parts. Since the center is now smaller due to boxes on both sides, the
impression of the middle part is not as empty as it was before.
The buttons were designed as box whose blue color matches the title.
For the search field, we
have evenly placed three fields on the left and on the right.
Our redesigned version of
the GUI:
-- end
of this assignment ---