Mobile App Prototype User Evaluation Report

1.   Introduction

With the original TFI Leap Top-Up application (National Transport Authority, 2016) users faced issues including NFC scanner difficulties, limited payment options, and slow balance updates. However users appreciated its simple layout. The new prototype addresses these key concerns while keeping elements that users like.

To improve the login process, the prototype offers a manual login option alongside the NFC scanner. Payment options have been expanded to also include Google Pay, Apple Pay, and Revolut. To address users’ concerns about slow balance updates, a message now informs users that updates may take time after payment.

The unclear and underutilized “capping” page has been moved to the side menu with a pop-up explanation about the page. This simplifies the bottom menu to focus on ‘add credit’, ‘transactions’, and ‘add ticket’. The ‘add credit’ page has been redesigned into two pages: the first displays the current balance, and the second allows users to select a top-up amount and complete the payment.

The new prototype aims to resolve users main frustrations and improve usability, while maintaining the app’s simplicity, delivering an improved user experience. (Appendices A,B)

2.   Role in the Redesign

In the redesign process, my primary role was Developer, and my secondary role Manager. As manager, I ensured good communication within the team and towards the module instructor. I also created an overview of the tasks, and set realistic deadlines together with team members.

Text Box: Figure 7Early on, we worked as a team to organize all data in Miro, others worked on the personas, scenarios, and HTA, while I helped define the Optional Requirements with the Data Analyst. At the end, I also prepared the content for the presentation slides. (Appendices C-G)

As the Developer, I created the final TFI Leap Top-Up prototype using Figma (Appendices A-B), based on the clear plan for the prototype visuals and functionality from the UI and Interaction Designer (Appendices H-J). First, I had to familiarize myself with Figma’s key functionalities, including building frames, designing interactions between them, and developing a layout. Once the basic structure was complete, I implemented advanced features, including a pop-up side menu, toggle buttons, input text fields, external links to websites and emails, pop-up notifications, and scrolling functionality. These features added interactivity and realism to the prototype, allowing users to visualize how the redesigned app would function. Overall, my contributions ensured the final prototype was functional and user-centred.

3.   User Study

3.2.       Procedure

The user study took place in locations suitable for individual interviews, with one on the street and four in a closed room. Participants consented to anonymous data collection and recording. They explored the new prototype by attempting to top-up and understand the pages on the bottom and side menus. Afterwards, they completed a Microsoft Forms questionnaire for quantitative data, followed by a semi-structured interview for qualitative insights. (Appendices K-X)

3.2.       Apparatus

During the interview, participants had access to both the prototype and the TFI Leap Top-Up App with a Leap Card. The study used Microsoft Forms to collect demographic data and responses to NASA-TLX (Hart, 2006), UEQ-S (Schrepp, 2017), and PSSUQ (Lewis, 1992) for quantitative insights. Participants completed the questionnaire on their own or provided devices. The interview was recorded on a mobile phone, and the quantitative data was analyzed using Excel.

3.3.       Participants

Five users participated in the study, with each interview lasting approximately 10 minutes (see Table 1). All of the participants were female, and the group was relatively young and academically focused, with four participants under 21 years old and currently studying. All participants were familiar with mobile devices, having used smartphones for more than 5 years, and spending a minimum of one hour on their devices daily.

 User 1User 2User 3User 4User 5Average
Quantitative data01:2707:0206:2701:5701:5303:45
Qualitative data03:5905:1009:4508:2006:2106:43
Total time05:2612:1216:1310:1708:1410:28
Table 1

 4.   Results in Comparison with Previous Study

4.1.       Quantitative Data

4.1.1.UEQ-S

User experience improved significantly from 0.8 for the original application to 1.33 for the prototype. Pragmatic quality rose to 2.1, and hedonic quality to 0.55, each improving by 0.5 points. This reflects higher user satisfaction with the new interface, and enhanced pragmatic functions, such as clarity and efficiency.

DimensionOriginalPrototype
Pragmatic quality1.552.1
Hedonic quality0.050.55
Overall score0.81.33
Table 2

4.1.2.NASA-TLX

All dimensions have significantly better results compared to the original application, with the overall workload (1.6) increasing by a whole point. The effort (2), and frustration levels (1.4) are noticeable, improving over one point each. This indicates that the prototype reduced the app’s initial somewhat high demand and frustrations effectively.

DimensionOriginalzPrototype
Mental Demand2.61.6
Physical Demand1.41
Temporal Demand2.61.8
Effort3.42
Frustration Level2.61.4
Performance32
Overall Workload2.61.6
Table 3

4.1.3.PSSUQ

Overall user satisfaction (1.7) increased significantly for the prototype. Most notably, information quality improved from 3.04 to 1.9, showing that the prototype effectively addresses clarity issues present in the original version. Additionally, interface quality and system usefulness have both improved, suggesting the prototype has resolved issues in these areas successfully.

SubscaleOriginalPrototype
System Usefulness2.171.6
Information Quality3.041.9
Interface Quality2.601.47
Overall PSSUQ Score2.591.7
Table 4

5.   Qualitative Data

5.1.1.Usability

The original application, described as ‘easy,’ improved further in the prototype, with users calling it ‘more useful’ and ‘well designed.’ Users initially desired more payment options, and were satisfied with the added options. However, one noted being restricted to a €5 top-up. Dependability items are further addressed in Cognitive Load. Visuals, originally described as ‘clean’ and ‘easy’, received continued positive feedback. Users appreciated the ‘minimalistic’, ‘clean’ design and the green theme, which felt environmentally friendly. A user did suggest adding a dark mode.

5.1.2.Cognitive Load

Users continued to describe the app as “easy” and “straightforward”. Most users appreciated the option to login manually, which resolved issues users had with scanning their Leap Card. Random downtime, and slow balance updates, were not mentioned as problems in the new evaluation. New dependability issues included slow app loading and difficulty clicking some of the icons. The suggestion to include an automatic top-up in the original survey was perceived positively. For future improvements, a user suggested adding push notifications.

5.1.3.User Satisfaction

Users continued to find the application ‘easy’ to navigate. The addition of an information icon improved the overall understanding of the ‘capping’ page. New concerns included a ‘busy side menu’ and difficulty finding the automatic top-up. Moving the ‘capping’ page to the side menu was generally accepted, with one user appreciating the simplified bottom menu, though another felt this change could be confusing. Feedback on the changed ‘add credit’ flow was mixed. Suggestions to incorporate the TFI Live application remained, while no users missed the initially requested search function.

6.   Discussion

6.1.       Usability

The growth in pragmatic quality (2.1), reflects user feedback stating that the application is ‘more useful’. Users were especially satisfied with the added payment options. Difficulties typing a payment amount can be attributed to Figma limitations; this issue will not persist in the final product. Other dependability points are discussed in Cognitive Load. The previous hedonic score 0.05 improved to 0.55, with users appreciating the minimalist design and environmentally friendly feel. Unlike before, users were less bothered by the application’s lack of excitement, resulting in a higher hedonic score. Adding a dark mode, as suggested, could further improve the hedonic quality.

6.2.       Cognitive Load

The overall workload improved, with significant improvements in effort and frustration level. This is mainly due to resolved difficulties, including a manual login option to work around scanning issues, the automatic top-up, and more payment options. There was also no mention of previously mentioned random downtime, or slow balance updates, possibly because of our added notification after payment. However, new issues included a long loading time, and difficulty clicking icons. Increasing the responsive touch area for icons should address this in future versions. A design implementation to further reduce the overall workload is to add push notifications for low balances.

6.3.       User Satisfaction

The overall increase in user satisfaction can largely be attributed to better information quality, which increased as a result of an available explanation for the ‘capping’ page, and a message about slow balance updates after payment. However, users did note a ‘busy’ side menu and difficulty finding the automatic top-up. Future iterations could organize the side menu into sections with titles for clarity. Improved inter-face scores suggest the improvements were well received, reflected by users appreciating the simplified bottom menu. System usefulness also improved, but could further benefit from addressing the repeated request to incorporate the TFI Live application.

7.   Conclusion

The close collaboration within our group was essential to design a functional  prototype based on user feedback. Based on the insights organized by the Data Analyst, the Interaction Designer created workflows, while the UI Designer developed layout sketches. Finally, I, as the Developer, used these designs to create the final prototype in Figma. Open communication and regular meetings ensured we fully understood each other’s perspectives, proposals, and feedback.

The user study for this prototype showed improvements in usability, cognitive load, and user satisfaction. Key changes include resolving Leap Card scanning issues with a manual login option, adding payment methods, and improving information clarity with pop-ups and explanations. Features such as automatic top-up, a simplified bottom menu, and a reconstructed ‘add credit’ page also contributed to improved scores.

For future iterations, the application could benefit from a dark mode, push notifications for low balances, a better-structured side menu with titled sections, and the incorporation of TFI Live into the application. Additionally, the responsive touch area for icons should be increased. Also, text input should be enabled, for example for top-up amounts, which is not possible in Figma. These adaptations would further improve the user experience with the TFI Leap Top-Up application.

8.   References

  1. Hart, G. S. (2006) NASA-TASK LOAD INDEX (NASA_TLX); 20 YEARS LATER. Moffett Field, CA. NASA-Ames Research Center. Accessed: 26/11//2024
  2. Lewis, J. R. (1992) PSYCHOMETRIC EVALUATION OF THE POST-STUDY SYSTEM USABILITY QUESTIONNAIRE: THE PSSUQ. Boca Raton, FL. IBM Design Center. Accessed: 26/11/2024.
  3. National Transport Authority (24 January 2016) Leap Top-Up (Version 0.4.2) [Mobile App]. Available at: https://play.google.com/store/apps/details?id=ie.leapcard.tnfc. Accessed: 26/11//2024.
  4. Schrepp, M. et all. (11 September 2017) Design and Evaluation of a Short Version of the User Experience Questionnaire (UEQ-S). SAP AG. UNIR. Accessed: 16/11/2024

9.   Appendices

9.1.       Appendix A; Figma Prototype

https://www.figma.com/proto/5XyVblwMSQOes4cc9M6bgi/TFI-Leap-Top-UP?node-id=0-1&t=IFUvL8SYrlOvxEWj-1

9.2.       Appendix B; Figma Prototype Workspace

https://www.figma.com/design/5XyVblwMSQOes4cc9M6bgi/TFI-Leap-Top-UP?node-id=0-1&t=tZBGWYIzLRXcPNij-1

9.3.       Appendix C; Miro Workspace

https://miro.com/app/board/uXjVLFGKhHo=/?share_link_id=301860895743

9.4.       Appendix D; Personas and Scenarios

https://docs.google.com/document/d/1rzPvJnoSw_Tlk-KJI1ZXrOnA5chqeiNCOLpaF8gWzec/edit?usp=sharing

9.5.       Appendix E; Hierarchical Text Analysis

https://docs.google.com/document/d/1BAV72j4YjW1f0UwnRB-zP39Ovi_n6MUK8HBou6OS8Rs/edit?usp=sharing

9.6.       Appendix F; Optional Requirements and MoSCoW analysis

https://docs.google.com/document/d/1rOcCRLkFrLLphMfxlDs7hFQXUmry8uymY2s7TQ6OT2k/edit?usp=sharing

9.7.       Appendix G; Presentation

https://www.canva.com/design/DAGXNkEhKKs/XfL3at4J0yK-Vv5bC8YhkA/view?utm_content=DAGXNkEhKKs&utm_campaign=designshare&utm_medium=link&utm_source=editor

9.8.       Appendix H; Data Analysis

https://docs.google.com/document/d/1ZmMHTc9lRxULbcvqtX18Y_jA8EccdQlmiCely4oPkUM/edit?usp=sharing

9.9.       Appendix I; User Flow Chart

https://xmind.ai/share/SjiD6B0o

9.10.   Appendix J; UI Design

https://docs.google.com/document/d/102nZskvhHCOwAZKL31RyTNMhi0bSh2VCH7S3AZddxlI/edit?usp=sharing

9.11.   Appendix K; Microsoft Forms Questionnaire Original

https://forms.office.com/Pages/ResponsePage.aspx?id=pVz-Rm-GQk6S6e2HhiRVRT3lZYV_IHFFt-L_QFLmbiVUN09ZRlZJSEJON0w5MUg5WDdMVzMxNkRQVi4u

9.12.   Appendix L; Microsoft Forms Questionnaire Prototype

https://forms.office.com/Pages/ResponsePage.aspx?id=pVz-Rm-GQk6S6e2HhiRVRT3lZYV_IHFFt-L_QFLmbiVURVFIN0ZUUk5OVUtQOThQSEtLNERJTk1YTS4u

9.13.   Appendix M; Qualitative Questions Original

https://docs.google.com/document/d/1GXrKwZmCqsyzszgpOJr9koaj-oYLKDkC/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.14.   Appendix N; Qualitative Questions Prototype

https://docs.google.com/document/d/1tnZCNOVzz0QParGyOaXOpvVizMf5Wy_WOL52_4JDiFw/edit?usp=sharing

9.15.   Appendix O; Qualitative Interview Summary Original

https://docs.google.com/document/d/1KDs1RzFF7MPRff4YTJnwVzqNu5tHMj4F/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.16.   Appendix P; Qualitative Interview Summary Prototype

https://docs.google.com/document/d/1uwdHL_uLtFhO7rAYwH50nIMxqQQ5j2iGj33m6VipyKA/edit?usp=sharing

9.17.   Appendix Q; Raw Quantitative Data Original

https://docs.google.com/spreadsheets/d/1SaKq04b9d4eA-NVadVNdqajNy7DYMSuQ/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.18.   Appendix R; Raw Quantitative Data Prototype

https://docs.google.com/spreadsheets/d/1Tj2JUH4GnIcLUhwpqIlieYV1NXh3uHiFSojkDbW7oMA/edit?usp=sharing

9.19.   Appendix S; Quantitative Data Ready for Analysis Original

https://docs.google.com/spreadsheets/d/1XF1OkMoLzyYOvScg6oe5zHbMuVKHiBq8/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.20.   Appendix T; Quantitative Data Ready for Analysis Prototype

https://docs.google.com/spreadsheets/d/1avnqRkkymGnb5KbCRpQClbyFw_idwM08acw4Osp4efM/edit?usp=sharing

9.21.   Appendix U; Quantitative Data Tables Original

https://docs.google.com/document/d/1g4e3BmY80Vy6YeRYy-DnUQloqXthBcjN/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.22.   Appendix V; Quantitative Data Tables Prototype

https://docs.google.com/document/d/1xZY-DVy50aiHgzVxpfnEuspbkWT3Er0iUhhYDG-PD54/edit?usp=sharing

9.23.   Appendix W; Qualitative Data Analysis Original

https://docs.google.com/document/d/1ccraJ9YkutRjJ4UwKX3B9Fvqf9eoZ1Xk/edit?usp=sharing&ouid=117211441120935478700&rtpof=true&sd=true

9.24.   Appendix X; Qualitative Data Analysis Prototype

https://docs.google.com/document/d/16gB72pjjELCj32jG3ZhJ1YLvc4gXfmIVP6uTq2uDTsI/edit?usp=sharing

Leave a Comment

Your email address will not be published. Required fields are marked *