UX of Royal Colleges of Medicine

User Experience of
Royal Colleges
- A review

2 3

Contents
6 Introduction

7 Royal College websites reviewed by Zabisco

7 Zabsico UX consultancy & design

8 User experience/UX
By Natalie Moore
- Customer Experience Planner 11 The start of the user journey
- The homepage

14 User-driven focus vs organisation focus

18 User interface

18 Using a hero

20 Navigation

22 User engagement

Hammad Khan 23 Accessibility
- Director of User Experience
26 Mobile web design

32 Summary

Published by
Zabisco Digital Limited
team@zabisco.com

www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement

4 5

Royal College websites reviewed by Zabisco

Introduction Figure 1: Royal College websites reviewed

I
n this paper, we are reviewing Royal Colleges for
how good, or not so good, the digital user experience
(UX) is that they deliver to their members and Zabisco UX consultancy & design
visitors. A Royal College (RC) is a professional
body for people in a particular medical profession.
The RC exists to provide resources and networking At Zabisco, we specialise in understanding users,
opportunities for those people and it exists because it is funded their needs and motivations. We shape their digital
by those people, its members. Therefore, ultimately, a RC is user- experience through designing the environment and
centred in essence. The members/users pay for an affiliation to the tools which create that experience, with the end users
always in mind. For us, users come first and remain
organisation, to get what they want out of the organisation; they the key consideration throughout.
have a significant impact on how the organisation should be run and
the services it delivers.
Therefore, with them being user-centred in principle, we
In the following sections of this paper, we will discuss
would expect all member organisations like RCs to deliver
what UX is and why it should be a fundamental concern
a user-centred digital service, providing a positive user
in digital design. In reviewing the RC websites, we
experience (UX). As such, here at Zabisco, we have done
will appraise the various aspects that create the UX,
a broad review of a range of RC websites. This paper
pinpointing across the RCs sector we have researched
has been produced to discuss our review of the digital
where we feel the user experience is being effectively
presence in this sector and indicate where opportunities
addressed and where it is not.
exist to improve their UX. With a large amount of RCs
existing, not all have been reviewed; outlined on the next
page are the websites we have explored. Furthermore,
of course, non-member access is restricted; therefore,
we can only comment and discuss pre-login experience
across the range of sites. The discussion we present
cannot reflect the quality of UX in the secure areas.


6 7

When you consider the visitors to the website of a RC,
the diversity in whom they are, why they are visiting the
website and what they want from it becomes apparent.
Firstly, there are members and non-members; instantly
there are two factions of people with a different reason

User
for visiting the website. Within those two groups are
different types of users: not only different job roles,
gender and ages, but different levels of internet literacy,
knowledge, loyalty or affiliation and attitudes. Each of
these users may be engaging with the website with a
different motivation and goal and, therefore, will have a

Experience/UX
different experience from the same site. Considering who
your users are should be the first thing identified when
designing a website and should remain at the forefront
throughout.

Firstly, why bother with user experience at all? UX is a well- Then, consider the experience those users will have from
established profession and an integral part of digital design the website. We’ve established there are different users,
with different needs and wants, but what is the same is
because it is identifiably important. The term is reasonably
that all users will be seeking a satisfying experience. The
self-explanatory; we work on the experience that a user has experience is important; it affects the user’s perception
when using a digital service. Those two words can be considered of the organisation, the level of engagement this incites
individually though to give two key factors why this practise is with the organisation and potential leads created with the
important and what should be taken into account: who is the user organisation beyond the website. As stated, organisations
like RCs exist for their users and remain in existence by
and what is the experience?
retaining and attracting new members and, thus, funding.
So, who is the user? Professional bodies, such as RCs, Therefore, the user experience of the website is an
cater for a particular group of people as they exist around integral part to the success of the organisation.
a certain profession. The organisation is there to deliver
resources and opportunities relevant to people who work
in a particular field. This does not mean, however, that
those people’s drivers, interests and motivations are
necessarily the same. The RC may be providing for a
large cohort of people with one major factor in common,
but that does not mean there is little diversity within that
group.


8 9

This experience is determined by how easy the user
journey is and what the user gets from it. A user
journey is the route a visitor to the website takes to find
what they want: the pathway from A to B. This may be
via C, D and E; it may be as short or long, simple or
complicated as the design of the website helps to make
it. In the following parts of the paper, we’re discussing
the elements of the RCs website designs that shape
the user journey and the overall UX. There are many
factors of digital design that combine to create the UX
and each of these, and the interactions between them,

The start
should be considered. We have broken these aspects
down into a 10-point review, listed below.

of the user journey
User-driven vs organisation-driven focus

Information architecture
– The homepage
User interface
Actually, the start of the journey is not the homepage; the start of
Interactivity and engagement the journey is the user’s motivation and how they find their way to
the website. This highlights our first point – the user, who they are
Aesthetic appeal and media and their motivations and goals, always comes first. Something to
consider…
Accessibility
For the purposes of this paper, however, to address the
Functionality and features website UX, the starting point for a user interacting with
the organisation’s digital service is the homepage. This is
the first interface they see, where they begin to find what
Content they are looking for. From this first impression, the user
will obtain a perception of the organisation and an instant
Social integration and sharing perception of how easy this website may be to explore.
For instance, look at the examples below; it can be seen
Mobile and responsive web design with these how the design affects the appeal of the site
and sets expectations of how easy the site may be to
use.

The rest of this paper discusses RC websites in terms
of these points and their inter-relationships; some are
considered in conjunction where they heavily interact.
Firstly, however, we’re looking at the beginning of the
user journey and first impressions before we review in
this level of detail, although some of these points will of
course be touched upon.


10 11

Figure 4: Royal College of Psychiatrists, homepage

Figure 4 - The Royal College of Psychiatrists, however,
Figure 2: Royal College of Veterinary Surgeons, homepage are an example of poor UX. The homepage is not utilised
effectively to engage the user. There are clearly four
Figure 2 - The Royal College of Veterinary Surgeons sections on the homepage but it is not easy to read what
website is a good example of a clear, appealing is in those sections, nor are they very inviting to incline
homepage. With an organised layout, interactive hero me to try to read it.
and uncluttered design, it is not overwhelming at the first
glance and it is easy to digest the areas of the site.

Figure 3 - The Royal College of Anaesthetists Figure 5 - The Royal College of Ophthalmologists attempt
website also incorporates these features to make better use of the homepage to deliver structured
to positive effect. This website is currently content, but have not been successful in achieving a
undergoing a redesign, highlighting both an good UX. There is too much content and too much text
understanding in the sector of the need to for a user to work their way through. The design layout
update website designs and an understanding also incorrectly makes sections look interlinked that are
of what the up-to-date design features are for entirely separate, as shown and described next to the
better UX. image Figure 5.

The blue and green sections above
are very bold in comparison to the
surrounding text and the layout of the
Figure 3: Royal College of Anaesthetists, content and features makes these look
homepage like headings for the text below on Figure 5: Royal College of Ophthalmologists, homepage
first glance, which are in fact separate
sections of unrelated content.


12 13

User-driven focus
vs organisation
focus
As we have said, the user comes first. The users’ wants, needs, The Royal College of Ophthalmologists were exemplified by us previously in Figure
motivations and goals will determine why and how they approach 5 for their homepage not providing an optimal UX, through being too cluttered and
having a disorganised layout. They do however provide user-centred links on the main
and go through a website. So, logically, provide users a journey navigation, as shown below in Figure 7.
based on who they are and what they need: streamline their
journey and make it easier for them. As reiterated throughout this
paper, considering whom your users are and their motivations and
keeping this at the forefront throughout ensures a user-centred
design.

A user journey initiates from the homepage, therefore
the digital service should be user-centred from this
point. Some RC websites we have seen incorporate this
principle to some extent, to direct people to areas of
the website related to that user. For example, the Royal
College of Veterinary Surgeons, that we highlighted as a
good homepage example, uses a ‘Quick links’ section to
display user-centred or user-specific content, as shown
below in Figure 6.

Figure 7: User-centred navigation - Royal College of Ophthalmologists

Figure 6: User-centred navigation - Royal College of Veterinary Surgeons


14 15

Many of the websites reviewed do not take this approach.
They are designed around what the organisation has
to offer in terms of departments or services rather than
whom they are offering it to. Of course, being user-
centred does not mean everything must derive from
a specific user perspective. Yes there are variations
amongst user groups as outlined earlier in this paper, but
there are some commonalities in terms of content they
will be looking for. Therefore, some task or organisation-
based content is user-centred, but which elements these
are needs to be identified and the presentation of them
must be considered to provide an optimal user journey.
In member organisations such as RCs, membership
and disseminating information through news or offered
services are most commonly placed at the forefront on
homepages. However, the more up-to-date websites
present these aspects in a visually more appealing and
immediate way, enabling users to easily access this
information more instantly – thus providing a user-centred
UX. Some examples of RCs who address these aspects
are featured in Figures 8, 9 and 10, with some comments
on why they achieve it in a better way.

Figure 9: User objective based content for better UX - Royal College of Pathologists

Figure 8: User objective-based content for better UX - Royal College of Obstericians and Gynaecologists

Selected site areas feature clearly on the homepage to streamline the
journey for key information users look for.

Use of icons to instantly signify what information the content will give
the user. For example, the calendar picture indicates an event and
the icon provides the date information the user needs. Figure 10: User objective-based content for better UX
- Royal College of General Practitioners


16 17

User interface Figure 11: Utilising an interactive hero - Royal College of General Practitioners

The layout, links, menus and navigation options are all designed to make up the user interface which
facilitates the UX. The aesthetics of these aspects and any media used to enhance interactivity and
engagement create a better UX. Following, we’ll look at these various factors is aspects of website
design and how well RC websites are addressing them.

Figure 12: Utilising an interactive hero - Royal College of Veterinary Surgeons

Using a hero
Effective use of a hero on the homepage has a positive
impact on the experience of a website from the outset.
Using a hero not only makes a webpage look instantly
more aesthetically appealing, it enables more content
to be displayed in a condensed fashion. A sliding hero
creates a level of interactivity with the user, engaging
them, and gives an opportunity to display information the
organisation wants to highlight and draw attention to. In
the figures below, we’ve selected who we feel utilises a
hero for beneficial UX.

Figure 13: Utilising an interactive hero - Royal College of Anaesthetists


18 19

We’ve inserted examples here from our own website
design for the Institute of Engineering and Technology
to demonstrate the effectiveness of these interactive
features.

Figure 15: Sliding menu panel - Institute of Engineering and Technology
Figure 14: Sliding menu panel - Royal College of Veterinary Surgeons

Navigation
Of course, a critical part of the user journey and UX
created is the navigation. Several factors impact whether
the navigation provides a good UX or not: a combination
of the Information Architecture, aesthetic design and
interactivity involved. We’ve previously discussed
initiating a user-centred navigation from the homepage
Within the site, cues and feedback to the user are
but it is important to retain a user-centred perspective
important to facilitate their journey. As can be seen in the
throughout in forming user journeys.
figures above, small visual cues can make significant
changes to user understanding. In each of the three
Menus and links should be clear and direct the user on a
images above, the interactivity of these areas is indicated
streamlined journey. Cluttered pages should be avoided,
by the inclusion of the arrows. They intuitively signal to
so making use of interactive features such as drop down
the user this means they can click on the content to move
menus, heroes, sliding and collapsible panels allows for
it in a direction. The arrows on the collapsible panel in
content to be displayed in a condensed and organised
Figure 16 change direction to feedback to the user which
format. This approach is more digestible for the user. For
section is ‘open’ to reveal information.
example, the Royal College of Midwives and the Royal
College of Speech and Language Therapists, whilst
Figure 16: Collapsible menu panel to condense information Feedback and cues are important throughout navigation,
falling down on other aspects of UX, utilise drop down
- Institute of Engineering and Technology to indicate to the user where they are on the site and
menus on the main navigation bar. This provides better
what their options are and their actions mean. The use of
UX in terms of displaying immediately to the user what
colour is important; for example on the main navigation,
content a section contains without having to leave the
changing the colour of a tab compared to the rest of the
page they are currently on.
tabs highlights to the user what section they are on. This
can be done texturally also, for example by changing
Very few of the RC websites utilise other features outlined
the impression of the text when the mouse hovers over
above such as sliding and collapsible panels. The Royal
it indicates to the user it is a clickable link. Breadcrumbs
College of Veterinary Surgeons is the only website we
are a useful tool to simply demonstrate to the user where
found to incorporate a sliding feature to present a menu
they are on the site, where they were previously and
of content. This interactivity engages users and makes
allow them to go back to a section in one action.
them want to look at what is there.


20 21

Figure 17: User engagement through aesthetics and media

User engagement Accessibility
For visitors to the RC websites, members or non- RCs have many members and visitors to their websites. They are
members, to be incited to explore the website, to achieve continuously looking to increase their member base and retain
a predefined goal or be attracted to view other areas of
the site, they need to be engaged. Photos and images
those acquired, to maintain and increase revenue and grow as an
are utilised on the majority of the websites we have organisation. As user-centred organisations, RCs need to cater for all
reviewed, which make the webpages visually appealing. of these existing members and visitors and their needs to provide
In some cases appealing aesthetics are adopted on the optimal services. This applies to the digital services they provide;
homepage but not carried through in sub-level pages. In they should be designed to be inclusive for all members, considering
the case of the Royal College of Radiologists, this visually
appealing engagement is somewhat absent from the
potential disabilities and requirements they may have. Some, but not
outset, as highlighted in the figure 17. many, of the RC websites we reviewed are incorporating accessibility
functionality into their websites, but very few are doing so in an
The Royal College of Nursing website shown in Figure
17 is the only RC website we reviewed to utilise video accessible way.
media to capture the audience and engage them with the
organisation. As covered above, cues and feedback are To explain this point, here are some examples of
important and here the presence of the triangle icon, the accessibility addressed poorly. The Royal College of
‘play button’, makes it immediately obvious to the user Speech and Language Therapists have gone to some
there is a video placed in the hero for them to watch, and lengths to include accessible options on their website.
they know where to click to start the video.


22 23

Figure 18: Accessibility option - Royal College of Speech and Language Therapists

If these drop-down options (Figure 18) have not been
noticed, there is an Accessibility section to provide help,
shown in Figure 19 . If a user is having difficulty in using
the website, are they really going to be able to read these
instructions to figure out how to make the necessary
changes? It cannot be assumed that someone else would
be there to provide assistance.

Figure 19: Poor accessibility instructions - Royal College of Speech and Language Therapists

It is not enough just to have some options available,
consider how they are presented. If a user has difficulty
in viewing the site and needs different options, make it
easier for them to locate how to modify this; is presenting
the options in the same text and style as the site they
are struggling with appropriate? The Royal College of
Radiologists have also provided poor UX in this regard.


24 25

Figure 20: Accessibility instructions - Royal College of Radiologists

Here, the user has to locate ‘Accessibility’ in small text
in the footer, click this and read the instructions in the
standard text size to find out how to change the text font
size. This seems a convoluted process for something that Figure 22: Accessibility functionality best example - Royal College of Veterinary Surgeons
could be presented from the outset visually, that actually
provides more accessible assistance.
The Royal College of Veterinary Surgeons most
successfully includes accessible options presented in an
The Royal College of Ophthalmologists (a), the Royal easy, visually helpful way to the user. These few icons
College of Pathologists (b) and the Royal College of clearly show the user can change the text size, can
Physicians (c) at least present the option to change font change the colour and can alter the display .
size in a visual way that users recognise, as shown.

a) b) c)
Figure 21: Accessibility functionality to change font size

However, this option to change text size on the Royal
College of Physicians appears when the user navigates
on to a sub-level page; it is not available on the
homepage where the user should see where to start
from. Furthermore, this functionality does not actually
work. There is no difference between the first two text
size settings and repeatedly clicking on the enlarged ‘A’
simply stretches the content creating greater line spacing
but the font size does not actually alter.


26 27

Mobile and responsive
web design
The digital world and how people access websites is changing. Sales in desktop PCs are declining and we Apple’s iPhones and iPads are leading this market with
others quickly following suit. At the beginning of this year,
are seeing an increased market in mobile devices such as smartphones and tablets. The graph below shows
Microsoft published a report on their upgraded operating
recent and predicted trends. system Windows 8 and outlines how it will be an upgrade
for better experience on mobile devices. The user
experience to be had in comparison to Windows 7 on a
PC will be very similar; the improvements are proposed
to be significant for small portable devices like tablets and
smartphones, suggesting that Microsoft recognise this as
the changing face of the digital market. “2” on page 33

Figure 23: Trend in smartphone sales “1” on page 33


28 29

This has significant implications for UX and web design,
and the accessibility and usability of websites when
put into today’s contexts. If many people already,
and continuously increasing amounts of people, are
accessing websites on mobiles, it should be a priority
whether your website is suitable for browsing on a
mobile.

At Zabisco we created an infographic about the UK
smartphone market in 2011, demonstrating the trend
towards smartphone usage. An excerpt from this is
below in Figure 24.

View the full infographic at: There are fundamental differences between mobiles and
http://www.zabisco.com/blog/wp-content/uploads/2012/03/ desktops which mean that a desktop website design
smartphone-infographic1.jpg does not transfer well to mobile browsing. The screen is
obviously smaller, so how easy content is to see and read
becomes an issue. The users do not have a mouse to
navigate and select buttons and content, they use their
fingers; target sizes become an issue. It is not so easy
and is frustrating for a user to type a lot of information
using touchscreen; minimising the need for user input
becomes important. In addition to these issues, internet
connectivity on a mobile can be less stable. Page loading
can be slower, therefore the content and navigation
should be designed with this accounted for; minimise the
need for input and page reloading.

Of those we’ve reviewed, even the RC websites that we
determine provide better UX are not optimised for mobile
and this is certainly a domain that anyone providing
digital services should be moving towards. We recently
published a blog on the key factors of great mobile web
design; for more information on effective mobile web
design, this can be viewed at:

http://www.zabisco.com/blog/the-keys-to-great-mobile-
web-design/.

Figure 24: Infographic on UK smartphone market 2011
– Zabisco


30 31

The Royal College of Anaesthetists

2nd
http://www.rcoa.ac.uk

The Royal College of Anaesthetists website
comes in a close second with clear pages, use
of imagery and use of navigation tools, such as
drop down menus. This website could, however,
provide a more user-driven journey from the
outset. The member login area is not as clear
and there is no obvious accessibility functionality.
It could be updated with more contemporary
features such as integrating media.

Summary
Now we have reviewed a sample of the sector, we’ll conclude this paper by awarding 1st place, 2nd place and last place for
website UX. We are not awarding a 1st, 2nd and 3rd place to showcase the top three; we want to show the product of not

LAST
considering the UX, what a website looks like if you disregard all the factors discussed in this paper. We have selected what
we feel are the top two sites and bottom site in terms of UX through reviewing the whole sample listed in Figure 1. For the
rest of those sites, we have judged some aspects to be good and some to be poor – consider where you think they would
rank in providing a positive, helpful, usable and engaging user experience.

PLACE

1st
The Royal College of Veterinary Surgeons
http://www.rcvs.org.uk
The Royal College of Veterinary Surgeons utilises
different aspects of web design to create a positive
The Royal College of Psychiatrists
experience for the user. The homepage is clear, easy to
navigate, incorporates an engaging hero and provides http://www.rcpsych.ac.uk
a user-centred journey from this point. Images are used The Royal College of Psychiatrists is an
throughout that are appealing and engaging, symbolic in outdated website. It lacks organisation and
demonstrating what information that content will provide. appeal from the homepage and it is not easy
It could still be further improved with media to enhance to read. A very uninviting site would be very
interactivity. unlikely to attract new members. Likewise it is
unlikely to encourage current members to use
the services of the organisation or explore what
is available as there is nothing appealing to
draw them in.


32 33

Table of Figures Bibliography
1
5 - Figure 1: Royal College websites reviewed http://money.cnn.com/2010/07/20/technology/desktop_PC_
death/index.htm
10 - Figure 2: Royal College of Veterinary Surgeons, homepage
2
http://www.extremetech.com/computing/115003-microsoft-quietly-
10 - Figure 3: Royal College of Anaesthetists, homepage kills-off-the-desktop-pc

11 - Figure 4: Royal College of Psychiatrists, homepage

11 - Figure 5: Royal College of Ophthalmologists, homepage

12 - Figure 6: User-centred navigation - Royal College of 17 - Figure 13: Utilising an interactive hero - Royal College of
Veterinary Surgeons Anaesthetists

13 - Figure 7: User-centred navigation - Royal College of 18 - Figure 14: Sliding menu panel - Royal College of Veterinary
Ophthalmologists Surgeons

14 - Figure 8: User objective-based content for better UX 19 - Figure 15: Sliding menu panel - Institute of Engineering and
- Royal College of Obstericians and Gynaecologists Technology

15 - Figure 9: User objective based content for better UX 19 - Figure 16: Collapsible menu panel to condense information
- Royal College of Pathologists - Institute of Engineering and Technology

15 - Figure 10: User objective-based content for better UX 20 - Figure 17: User engagement through aesthetics and media
- Royal College of General Practitioners
22 - Figure 18: Accessibility option - Royal College of Speech and
17 - Figure 11: Utilising an interactive hero - Royal College of Language Therapists
General Practitioners
23 - Figure 19: Poor accessibility instructions - Royal College of
17 - Figure 12: Utilising an interactive hero - Royal College of Speech and Language Therapists
Veterinary Surgeons
24 - Figure 20: Accessibility instructions - Royal College of
Radiologists

24 - Figure 21: Accessibility functionality to change font size

25 - Figure 22: Accessibility functionality best example - Royal
College of Veterinary Surgeons

26 - Figure 23: Trend in smartphone sales

28 - Figure 24: Infographic on UK smartphone market 2011
– Zabisco


UX of Royal Colleges of Medicine

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a UX of Royal Colleges of Medicine

Semelhante a UX of Royal Colleges of Medicine (7)

Mais de Zabisco Digital

Mais de Zabisco Digital (14)

Último

Último (20)

UX of Royal Colleges of Medicine