Essay: Proposal For UI Design Modifications For MYKI System Overhaul.

Passenger Transport Victoria are looking to overhaul their existing MYKI system for passenger ticketing and replace it with something radically different. They have requested that your team propose the user interface design modifications.

1. Perform a user analysis. You must have a clear view of the users of this system. Consider that not everyone is comfortable with the technology. For example, you need to deal with user variation such as age or language skills.
2. Perform a task analysis to identify the tasks the potential users will perform, and in what order.
3. Consolidate your findings from your user and task analysis and propose a design and specify system requirements to realise the recommended interface. For example, the number of items to display, the screen size, what colours, how many different screens to display, the devices to you,the physical design.
4. Develop a low-fidelity (paper) prototype (a minimum of 4 screens). Based on the above requirements, develop a preliminary design of theuser interface. At this stage, the prototype is basically a medium to support your initial concept and ideas. For example, the prototypeshould show where the relevant button locations, how much information would be presented on each screen etc. Low- fidelity prototyping is mainly to allow designers to produce alternative designs expediently without having to go into depth or functionality. Think of low-fidelity prototyping as the 5D tool for: design, draft, decide, discard and do-over.
5. Perform an interim evaluation of your design by creating a method of feedback and asking 3-4 potential users (e.g. friends, family members, classmates, etc.) to complete the feedback for your low-fidelity paper prototype. Carry out the evaluation according to prescribed methods found in the textbook (Shneiderman & Plaisant, 2014) or from otherscholarly sources. Use appropriate survey techniques. Analyse the data you have collected from the user evaluation and note down any recommendations as to how you could refine and improve on your initial design
6. Based on the user test feedback and recommendations develop a high-fidelity prototype. The high-fidelity prototype should be an online mock-up of your proposal and should demonstrate some navigation, although it does not need to work as a complete interface. A minimum of 4 screens should be produced in correspondence to your storyboard. The high-fidelity prototype must be computer based and any software is acceptable including PowerPoint, storyboarding, etc.
7. Create an evaluation plan with recommendations on the tools and methods you intend to use to evaluate the usability of your interface.
8. Produce a report to document the tasks and the outcome of your efforts undertaken for the project. Remember, this report is intended for your employers and as such be professionally formatted and presented. Your report will support the viability of your interface and as such needs to convince your employer that your interface design is satisfactory and that it meets user acceptance test.

Website Design and Its Impact on Usability

Website design is a key factor that influences usability and its visual appeal to the target audience. Studies conducted indicate that web design influences user perception and may impact traffic to a website (Lee, 2010). Poor website design turns off potential customers and may adversely affect web traffic. On the other hand, websites with an effective design visually appeal to the users and enhance user interaction and engagement which is beneficial for any firm (Hartmann, 2007). As such, many firms focus on developing a user-oriented design that can appeal to users. Website design encompasses various aspects such as typography, color, space, etc. These aspects are vital in defining the aesthetics of the design (Michailidou, 2008). Incorporating these aspects into a website is essential in improving site usability. Also, it is vital for developers to consider human-computer interaction principles in order to build effective and engaging designs (Shneiderman, 2010). In this report, we evaluate a website used by Public Transport Victoria, an authority responsible for managing public transport in Victoria State. We’ll place emphasis on learning users who use the system and the tasks they perform. Based on the analysis, a prototype for the system will be developed.

Passenger Transport Victoria is an online system that serves a large audience. The primary audience consists of passengers traveling to various destinations. These passengers belong to different age groups, cultures, races, and ethnicities. They want to use the system to get tickets that can enable them to board the bus. Through the online system, users can make journey plans and purchase tickets in advance.

Users’ goals for this website include being informed, create travel schedules, and buy travel cards. For the users to remain informed, the website has to provide updated travel information such as the status of travel routes, details about various destinations, information on how to buy travel cards, as well as modes of transport available near the airport or train station. To create travel schedules, the website has to allow users to sign in into their accounts and identify the destinations they want to. Having determined their destinations, users can choose the timing of their journey to create the travel schedule which is saved on the website. For users to purchase travel cards, the website allows them to select their destinations and pay for their cards. Based on the analysis, it is apparent that the website is designed to meet users’ goals.

The Audience and User Goals for Passenger Transport Victoria Website

Various individual characteristics may affect behavior with the system. People with physical disabilities face challenges when using systems that are not optimized for accessibility (Harper, 2008). If the online system is not accessible, such people will have problems using it. People with poor concentration need a minimalist design which has less clutter (Albers, 2011). Given that the system displays a lot of information on its web pages, it may not appeal to them.

Users have knowledge about the functionality of the website including the navigation options which assist them to perform their tasks effectively. Through the website, passengers remain updated on various travel-related issues hence can plan their journeys which is vital in helping them to save time when traveling. Additionally, the website saves them the hustle of going to the station to buy a travel card as they can order it online.

Users of the website are interested in saving time and being informed. The website is designed to align with these interests. By providing an online purchase feature, the website allows users to purchase their travel cards online instead of visiting the station where they may have to queue. This saves users’ time which is spent doing valuable things that can benefit them. Users also seek to be informed about their destinations and modes of transport. The website provides this information in a well-designed and understandable manner that keeps them informed.

Target users may or may not have experience in using similar websites. A majority of them are tech-savvy people as they use smartphones to access websites. Given that the online system is designed as a website, most of the users may be familiar with the user interface and find it usable. For those who have not used such a system, the website incorporates usability and simplicity concepts hence is easy to use for noobs. Through this website, users seeking to travel to any destination can access it, reserve, and pay for a ticket as well as read content provided in order to remain updated.

The website serves a broad audience consisting of people with varying characteristics. Typically, the website is used by adults irrespective of gender. Users have reached at least secondary education level and live within the state of Victoria. They have different culture and nationalities, but a majority of them are white Australians who form the majority of the population in the state.

Users interacting perform various tasks. Key tasks include planning journey, purchasing travel card, and viewing information. To plan their journey, users leverage journey planner, a key feature included on the website. The feature allows users to select starting point of their journey and their destination. Users can select date and time in which they will travel. Through this feature, the users can be matched with the bus, train, or coach that will be traveling at the time selected. The website allows users to purchase myki card which is a travel card that is used as a pass when traveling on trains, trams, and buses. The website provides a purchase feature where users can use online payment methods to pay for the card.  

Individual Characteristics and Website Usability

Another key task is viewing information. Information provided on the website include timetables, projects, locations, etc. Users interact with the site to view this information. The navigation options enable the users to navigate the site to find specific information. For example, users can view the timetable of various transport modes by selecting the ‘Timetables’ option. Users who select this option can view the timetable for metropolitan trains, trams, buses, regional trains, and coaches, as well as regional buses. The website allows users to view real-time information for trains, trams, and buses. For this information to be displayed, users have to search for a station. Additionally, users can use the navigation to find information on various places within Victoria State and projects being implemented.

The website relies on the functions of the computer and user. The computer is the gateway through which the website is accessed. It is displayed on a browser where a user can interact with it. It achieves its objectives when the user interacts with it. That is, the user has to navigate the site, sign in into his/her account, perform various transactions, etc. The key functions of the website involve informing users and supporting user transactions. These functions are dependent on user interaction with the site. That is, users have to view the pages in order to read content provided which informs them about various issues. Also, users make transactions on the site by inputting data such as destination, personal details, etc.

As expected, the system tasks align with the user goals. The goals of users are being informed, purchasing travel cards, and creating travel schedules. System tasks identified include providing content and supporting user transactions. By providing detailed content, the system supports users’ goals of being informed on various issues. The system task of supporting user transactions enable users to buy travel cards and create their travel schedules. When users encounter problems, the system produces messages that inform them what to do. For example, when incorrect login details are used, the website provides a warning message informing the user of the errors.

The proposed design incorporates a minimalist approach whereby only necessary information is included on the web pages. Typically, the design will have three main sections: header, content section, and footer. The header will be designed to contain elements that reinforce brand identity and allow users to navigate. That is, a brand logo will be displayed prominently on the header which is essential in grabbing user attention. The navigation menu will also be embedded in the header to help users find information on other web pages of the site. The navigation will be simplified by only including relevant menu links. This will enhance clarity of the navigation and help users to find information easily (Fang, 2007).

User Knowledge and Functionality of the Website

The content section is the main part of the website which displays content to the users. As such, it has to be structured in a manner that enhances visibility and readability. Grid columns will be used to display information on this section. Three columns can be used on the homepage to display information. The columns separate the content and make it easily visible. By doing this, the site can effectively showcase the content it has to offer. White space can be used in the content section to reduce clutter (Golombisky, 2013). Using the white space in the website to differentiate content groups is effective in improving visibility and site usability (Mifsud, 2011). Also, the footer will be optimized for visibility. The footer will display the sitemap and copyright statement.

With regards to color, the website has to incorporate appropriate colors that give a contrasting look to enhance its visibility. The color palette that will be used for this site includes violet, light green, black, and white colors. Violet color will be used on the header, a part of the homepage and the footer. Light green will be prominently used in the content section. Black and white colors will be used as text colors to improve the visibility of site content.

The system design has to focus on visitor’s attention. Since the goal of the website is to encourage to take action such as viewing information and interacting with various site features, it has to be optimized for users. Instead of using pop-ups to convey messages, the design of the website will enhance content structure to ensure it grabs and maintains user’s attention. The website will incorporate spectacular images to reinforce content. Images are key in maintaining reader’s attention and reinforcing the points highlighted in a post (Cyr, 2009). Images are also displayed on the homepage to make it appealing to users. Incorporating images is instrumental in improving the visual appeal of the website to users (Phillips, 2009).

The website design will display four screens which include the homepage, purchase card, view information, and about. Each of these four screens provides unique content that aimed at informing the user or supporting transactions. The design will be optimized for mobile devices. A mobile-first design approach has to be adopted when designing the website to ensure it is compatible with all devices irrespective of their screen-width. The website will incorporate a responsive grid system in order to adjust its resolution depending on the screen-width of a device. The grid system can improve the responsiveness of the website and ensure all web elements are adjusted to fit on any device used to access the site (Gardner, 2011).

Website Design and User Interests

To assess the effectiveness of the proposed design, feedback was obtained from four people who reviewed the interface. A questionnaire was used to collect their views on the data. Based on the data collected from the four users, some design issues were identified and recommendations were made to resolve them. Key design issues noted include inappropriate font, narrow navigation, and color alignment. The users recommended for the colors used in the prototype to be adjusted in order to enhance the readability of the website. The Colors should be organized to create a contrasting look that makes content displayed more visible to users. The text colors should also be adjusted to ensure they stand out in the background. With regards to the font used, Calibri font is not an appropriate web font. Thus, the web design should incorporate recommended web fonts that can make the text displayed readable. The navigation was reported to be narrow and didn’t appeal to users. It was recommended that the navigation should be given adequate padding and incorporate shades of color to indicate active navigation links.

Conclusion

As discussed, users’ goals for the website assessed are purchasing travel cards, creating travel cards, and being informed. The users leverage the site to remain updated on various travel-related issues and buy travel cards which can enable them to use various modes of transport available in Victoria State. The website is designed to support users’ goals as it includes features that help users to achieve their goals. The system provides a lot of content which is aimed at informing users about the transport modes available as well as various places and transport-related projects being implemented in the state. The website also provides features which allow users to perform transactions such as creating an account, purchasing travel cards, etc.

The new prototype proposed for the website assessed incorporates a minimalist design in which only relevant content is included. The color palette used for the design gives a contrasting look which is aimed at enhancing visibility. The prototype also uses images to improve readability and is optimized for mobile devices.  Design issues raised during the testing phase were addressed in the prototype redesign.

References

Albers, M. J. (2011, October). Tapping as a measure of cognitive load and website usability. In Proceedings of the 29th ACM international conference on Design of communication (pp. 25-32). ACM.

Cyr, D., Head, M., Larios, H., & Pan, B. (2009). Exploring human images in website design: a multi-method approach. MIS quarterly, 539-566.

Fang, X., & Holsapple, C. W. (2007). An empirical study of web site navigation structures' impacts on web site usability. Decision Support Systems, 43(2), 476-491.

Gardner, B. S. (2011). Responsive web design: Enriching the user experience. Sigma Journal: Inside the Digital Ecosystem, 11(1), 13-19.

Golombisky, K., & Hagen, R. (2013). White space is not your enemy: A beginner's guide to communicating visually through graphic, web & multimedia design. Taylor & Francis.

Harper, S., & Yesilada, Y. (Eds.). (2008). Web accessibility: a foundation for research. Springer Science & Business Media.

Hartmann, J., Sutcliffe, A., & De Angeli, A. (2007, April). Investigating attractiveness in web user interfaces. In Proceedings of the SIGCHI conference on Human factors in computing systems (pp. 387-396). ACM.

Lee, S., & Koubek, R. J. (2010). The effects of usability and web design attributes on user preference for e-commerce web sites. Computers in Industry, 61(4), 329-341.

Michailidou, E., Harper, S., & Bechhofer, S. (2008, September). Visual complexity and aesthetic perception of web pages. In Proceedings of the 26th annual ACM international conference on Design of communication (pp. 215-224). ACM.

Mifsud, J. (2011). An extensive guide to web form usability. Retrieved, 3(09), 2014.

Phillips, C., & Chaparro, B. (2009). Visual appeal vs. usability: Which one influences user perceptions of a website more. Usability News, 11(2), 1-9.

Shneiderman, B. (2010). Designing the user interface: strategies for effective human-computer interaction. Pearson Education India.