Part C – Implementation and testing
Section 1: Heuristic Evaluation Summary (15 marks)
Generate a summary for the Heuristic Evaluation (HE) you have completed in Part B of Project 1. You should have at least 10 useful comments (positive or negative) about the interface.
The HE summary chart should contain the following information:
a) Describe the problem or positive feature, using screenshots (based on the UI and US perspective)
b) Identify the relevant usability heuristics (from Nielsen’s Ten Usability Heuristics)
c) Estimate its severity (for problems, use cosmetic, minor, major, or catastrophic; for positive comments, just say good).
d) Decision to change the design – State clear reasons, why and Why not.
Report Part 1: Create a summary chart based on the heuristic evaluation report you submitted in Project 1. Be thorough.
Section 2: Refine your prototype (15 marks).
With the HE summary you have generated in (1), now refine your prototype and produce your refined prototype. Submit the original and refined prototypes for marking.
Note: You should submit both of your original prototype and your refined prototype to your marker for marking purposes.
Report Part 2: Write a paragraph (150 words approximately) justifying why you have finally settled down with this prototype model.
Section 3. Development Plan (15 marks)
Create a comprehensive development plan for the build of your interactive prototype. This development plan will guide your work to completion.
• Write down all the different components of your prototype.
• Split and define the various parts of your application into various activities. This could be much similar to “Use Cases and Use Case diagrams”.
(Note: You may present them as individual activities or link them together based on how they work.)
Use a spreadsheet or something similar for your implementation plan. You are free to structure the plan as you like, but if you’d like some hints an example development plan is provided for your reference along with this assignment for a sample prototype at
Do not copy the contents, but you could use the template. Thoughtfully structure deadlines. From your development plan it should be clear exactly what needs to be done, and when it will be done.
When you have completed the development plan, you should have a solid feeling for your interface and be ready to move into development.
Your plan should also list one or two outside constraints. These could include deadlines or exam dates for other classes, work, travels, or anything that will be most important for you to account for over the next few weeks.
Report part 3: Present the Development plan to the marker.
Section 4: Choice of App developer (10 marks)
Choose a suitable App developer framework for your project. With this developer framework, you are going to develop the skeleton or the wireframe (not necessarily the actual contents). The frame work is like a webpage template will all navigation working with / without the actual contents in it. The goal is to get a navigational skeleton up there that someone can click around and get a good feel of the application’s flow.
(Note: Make sure that if you have a button or icon, it links to something, whether it’s an implemented page or simply a holding page. This will prevent you being marked down for “broken links” in error!)
Report Part 4: Write a paragraph of the App developer application / framework you have chosen and why?
• Argue clearly why this application is considered suitable to implement your project.
• Ask yourself questions like “Is there an alternative?”
It is expected that your review is quite critical, as it influences the successful completion and efficient user interface in your app.
Section 5: Develop the User Interface (UI) (25 marks)
Develop a coherent interactive design front-end for the prototype you have developed.
What’s this for? A UX agency perspective
Start by thinking about what content would be included in the project, move on how that content would be organized, then the metaphorical context in which it will exist. Your UI design should flow from your storyboards, but should be more formalized with actual interface design ideas and things like navigation and orientation cues for the user.
Note: While are developing the framework, Remember! You will fill in the blanks and finish the details later. This is a minimal requirement for the building part of this assignment. You are encouraged to go beyond at this stage. You have your design. It’s time to implement, so make this look as professional and slick as you can; you want your users to get the feel of a real application.
Guiding Principles for UI Design:
• Evoke curiosity
• Keep things intuitive
• Create (moderate) challenge, which leads to user discovery and interest
• Create an engaging experience for the user
• Make it multimedia! – Do something substantively different from what could be accomplished in print, or with video or audio alone.
Questions to consider as you design:
• How is my metaphor carried out in the design?
• What is the grid and layout system I’m using to organize the information on screen?
• Are the buttons and other elements consistently placed on screen?
o Is their placement reasonably intuitive to the average user?
o Can I use an icon instead of/in addition to text?
• Am I presenting the content in a clear, accessible way?
o Am I presenting too much material at once? Not enough?
Your design should include:
• 1) Placement and basic appearance of buttons and other controls, and description of rollover and “click” behaviour,
• 2) Rough text and image placements and styles,
• 3) Mention of colours/patterns of text, background, etc., and any special treatments of images (e.g., sepia-tone photos, animated GIFs),
• 4) Description of any audio components (prompts, background music, interface sounds), • 5) Discussion of digital video or other “advanced” features you may include.
The final completed product would be an “.apk” file which could load into an emulator or to a mobile phone device for testing. Development methodology (Coding, App Inventor or Framework) does not really matter, as long as you are able to generate the “.apk” file.
Report Part 5: After completing the prototype skeleton, test run the source file either using an emulator or in your phone. Take snapshots or a short video of how the navigation works (the video should be less than 3 minutes) with suitable narration. Submit the video file to Moodle.
Section 6: Develop a User Test Plan (10 marks)
Next, develop a user test plan. Things that you will want to think about:
• What are you testing?
• What do you want to learn? What concerns, questions, and goals is the test focusing on?
• Where/when will the test take place (Test environment)?
• What tasks will you ask the user to perform that will help answer your questions?
• How will your participants share their feedback? (Think aloud, questionnaire/survey, post-test interviews…)
• Have you obtained consent from the evaluators? Did you attach the consent forms with this report?
• Did you brief the tester about your application and what to be tested?
A sample User test plan is uploaded for your convenience in Moodle
Report Part 6: Write a short paragraph covering most of the questions above. Call it “User Test Plan”.
Section 7: Conduct UI and UX Tests with two people including you. (15 marks)
Two evaluators to conduct UI and UX tests on your .apk file. One could be you, and you may select another person to conduct the testing for you.
Follow these instructions carefully
1. Provide and brief a clear and concise test plan to your evaluators.
2. Provide a list of UI and UX features to be tested in a template.
3. Once completed, have a debrief with your evaluator. This will help to compare the opinions of the two testers working on your application.
4. Write down any reactions or thoughts that came up. You will most likely forget them, so it’s important to write them down right after the user test.
Report Part 7: Write a short paragraph covering most of the questions above. This will form the third part of your report. Call it “Test Plan Results”
Note: Now as the last step of your work, submit your .apk file for marking. Though the end product of any project is very essential and appreciated, if at this point, you feel you have really worked hard, but could not finally produce the .apk file , do not panic. This project is about how you managed the project from Parts A to C and not 100% dependent on the end product. Submit as much evidence of your work or even the partially completed work as much as possible to your marking advantage. This could be in the form of screenshots, short videos, notes, development strategies used, and so on.
Part C – Implementation and testing