UX of Royal Colleges of Medicine
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

UX of Royal Colleges of Medicine

  • 613 views
Uploaded on

In 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 visitors.

In 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 visitors.

More in: Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
613
On Slideshare
613
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
5
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. User Experience ofRoyal Colleges - A review
  • 2. 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
  • 3. 4 5 Royal College websites reviewed by ZabiscoIntroduction 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 digitalby those people, its members. Therefore, ultimately, a RC is user- experience through designing the environment andcentred 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 remainorganisation, 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 andthe 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 4. 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 reasonUser 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 aExperience/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 fromestablished 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 isbecause it is identifiably important. The term is reasonably that all users will be seeking a satisfying experience. Theself-explanatory; we work on the experience that a user has experience is important; it affects the user’s perceptionwhen using a digital service. Those two words can be considered of the organisation, the level of engagement this incitesindividually though to give two key factors why this practise is with the organisation and potential leads created with theimportant 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 byand 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 5. 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 6. 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 fourFigure 2 - The Royal College of Veterinary Surgeons sections on the homepage but it is not easy to read whatwebsite is a good example of a clear, appealing is in those sections, nor are they very inviting to inclinehomepage. With an organised layout, interactive hero me to try to read it.and uncluttered design, it is not overwhelming at the firstglance 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 theFigure 3: Royal College of Anaesthetists, content and features makes these lookhomepage 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 7. 12 13User-driven focusvs organisationfocus 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 OphthalmologistsFigure 6: User-centred navigation - Royal College of Veterinary Surgeons www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 8. 14 15Many of the websites reviewed do not take this approach.They are designed around what the organisation hasto offer in terms of departments or services rather thanwhom they are offering it to. Of course, being user-centred does not mean everything must derive froma specific user perspective. Yes there are variationsamongst user groups as outlined earlier in this paper, butthere are some commonalities in terms of content theywill be looking for. Therefore, some task or organisation-based content is user-centred, but which elements theseare needs to be identified and the presentation of themmust be considered to provide an optimal user journey.In member organisations such as RCs, membershipand disseminating information through news or offeredservices are most commonly placed at the forefront onhomepages. However, the more up-to-date websitespresent these aspects in a visually more appealing andimmediate way, enabling users to easily access thisinformation more instantly – thus providing a user-centredUX. Some examples of RCs who address these aspectsare featured in Figures 8, 9 and 10, with some commentson 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 www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 9. 16 17User 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 www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 10. 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 TechnologyFigure 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 11. 20 21 Figure 17: User engagement through aesthetics and mediaUser engagement AccessibilityFor visitors to the RC websites, members or non- RCs have many members and visitors to their websites. They aremembers, to be incited to explore the website, to achieve continuously looking to increase their member base and retaina predefined goal or be attracted to view other areas ofthe site, they need to be engaged. Photos and images those acquired, to maintain and increase revenue and grow as anare utilised on the majority of the websites we have organisation. As user-centred organisations, RCs need to cater for allreviewed, which make the webpages visually appealing. of these existing members and visitors and their needs to provideIn 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, consideringthe case of the Royal College of Radiologists, this visuallyappealing engagement is somewhat absent from the potential disabilities and requirements they may have. Some, but notoutset, 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 12. 22 23Figure 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 13. 24 25 Figure 20: Accessibility instructions - Royal College of RadiologistsHere, the user has to locate ‘Accessibility’ in small textin the footer, click this and read the instructions in thestandard text size to find out how to change the text fontsize. This seems a convoluted process for something that Figure 22: Accessibility functionality best example - Royal College of Veterinary Surgeonscould be presented from the outset visually, that actuallyprovides 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 sizeHowever, this option to change text size on the RoyalCollege of Physicians appears when the user navigateson to a sub-level page; it is not available on thehomepage where the user should see where to startfrom. Furthermore, this functionality does not actuallywork. There is no difference between the first two textsize settings and repeatedly clicking on the enlarged ‘A’simply stretches the content creating greater line spacingbut the font size does not actually alter. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 14. 26 27Mobile and responsiveweb designThe 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 operatingrecent 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 www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 15. 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 UKsmartphone market in 2011, demonstrating the trendtowards smartphone usage. An excerpt from this isbelow 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 www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 16. 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. www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 17. 32 33Table of Figures Bibliography 1 5 - Figure 1: Royal College websites reviewed http://money.cnn.com/2010/07/20/technology/desktop_PC_ death/index.htm10 - 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-pc11 - 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 Anaesthetists13 - Figure 7: User-centred navigation - Royal College of 18 - Figure 14: Sliding menu panel - Royal College of Veterinary Ophthalmologists Surgeons14 - 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 Technology15 - 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 Technology15 - 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 and17 - Figure 11: Utilising an interactive hero - Royal College of Language Therapists General Practitioners 23 - Figure 19: Poor accessibility instructions - Royal College of17 - 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 www.zabisco.com | customer experience: research | architect | design | evaluate | implement www.zabisco.com | customer experience: research | architect | design | evaluate | implement
  • 18. Published by Zabisco Digital Limited team@zabisco.comwww.zabisco.com | customer experience: research | architect | design | evaluate | implement