<<

A7B39TUR

Testing mobile application for iOS

Cognitive walkthrough and heuristic evaluation

Feedly

Roman Shkola A7B39TUR Obsah

1. Introduction 3 1.1 About application 3 1.1.1 What is Feedly 3 1.1.2 History 3 1.1.3 What Feedly is used for and why 4 1.1.4 Target group of users 4 2. Use Case 5 2.1 What is the «Use Case» 5 2.2 Feedly’s Use Case 5 2.3 Indexing 6 3. Test methods 7 3.1 Usability inspection 7 3.1.1 Cognitive walkthrough 7 3.1.2 Heuristic evaluation 7 4. App testing 8 4.1 Sign in with existing account 8 4.1.1 Cognitive walkthrough results 9 4.1.2 Heuristic evaluation results 9 4.2 Searching items 10 4.2.1 Cognitive walkthrough results 11 4.2.2 Heuristic evaluation results 11 4.3 Add items to collection 12 4.3.1 Cognitive walkthrough results 12 4.3.2 Heuristic evaluation results 13 4.4 Items sharing 13 4.4.1 Cognitive walkthrough results 15 4.4.2 Heuristic evaluation results 15 5. Summary 16 5.1 Findings 16 5.2 Conclusion 16 A7B39TUR 1. Introduction 1.1 About application

1.1.1 What is Feedly Feedly is a aggregator application for various web browsers and mobile devices running iOS and Android, also available as a cloud-based service. It compiles news feeds from a variety of online sources for the user to customize and share with others. Feedly was first released by DevHD in 2008.

Picture 1: Main view Picture 2: Menu view

1.1.2 History In November, 2006, Edwin Khodabakchian co-founded DevHD. The company seeks to create a platform that uses RSS feeds, online storage, and social media integration to connect users with the information they find interesting. DevHD’s first project, Streets, which aggregates updates from a variety of online sources is the basis of Feedly. Feedly, which was optimized for RSS feeds, was first released on June 15, 2008. Originally called Feeddo, Feedly was first released as a web extension before moving onto mobile platforms. A7B39TUR On March 15, 2013, Feedly announced 500,000 new users in 48 hours due to the closure announcement of . By April 2, 2013, the total number of new users was up to 3 million. At the end of May 2013, the total user number was up to 12 million.

1.1.3 What Feedly is used for and why With feedly, you can easily organize all your publications, , YouTube channels in one place and consume and share more efficiently. No more zig zagging. All the content comes to you in one place, in a clean and easy to read format.

Some people use feedly to read blogs, some people use it to learn new topics, some people use to track keywords, brands and companies.

Faster access to lots of different sources of news and information means that you can more easily keep ahead with what is important in your industry and the topics you really care about.

1.1.4 Target group of users There are no concrete group of users, who can use this application. This app can use everybody who loves read news, blogs; learn something new and want to open the mind. Application is targeted on group of users, who are older than 12 years. Also, in this app you will find a content in 5 different languages such as english, italian, french, german and spanish, so, it could be a little constraint for users, who don't understand languages mentioned above. A7B39TUR 2. Use Case 2.1 What is the «Use Case»

A use case is a list of action or event steps, typically defining the interactions between a role and a system, to achieve a goal. 2.2 Feedly’s Use Case

Sign up

Sign in with Generic User existing account

«extend» Search news/ blogs

Add news/blogs to collection

Permanent User Read news/blogs

Share news in social networks A7B39TUR 2.3 Indexing

Use Use Case Primary Scope Complexity Priority Description case Name Actor ID

1 Search news/ Permanent In High 1 Opening a search bar by clicking blogs User on the appropriate icon and starts typing key words or

2 Add news/ Permanent In High 1 Clicking appropriate button to blogs User add the news/blogs and then choosing a category for added item(s) 3 Sign up Generic In Medium 1 Filling the registration form User

4 Sign in with Generic In Medium 1 Clicking the button with icon of existing User favourite social network and account confirming the access to user’s data such as personal information

5 Read news/ Permanent In Medium 1 Open detail page of concrete blogs User item

6 Sharing Permanent In Medium 2 Sharing links of chosen items User (news/blogs) to social networks A7B39TUR 3. Test methods 3.1 Usability inspection

Usability inspection is the name for a set of methods where an evaluator inspects a user interface. This is in contrast to usability testing where the usability of the interface is evaluated by testing it on real users. Usability inspections can generally be used early in the development process by evaluating prototypes or specifications for the system that can't be tested on users. Usability inspection methods are generally considered to be cheaper to implement than testing on users.

3.1.1 Cognitive walkthrough

The cognitive walkthrough method is a usability inspection method used to identify usability issues in interactive systems, focusing on how easy it is for new users to accomplish tasks with the system. Cognitive walkthrough is task-specific, whereas heuristic evaluation takes a holistic view to catch problems not caught by this and other usability inspection methods. The method is rooted in the notion that users typically prefer to learn a system by using it to accomplish tasks, rather than, for example, studying a manual. The method is prized for its ability to generate results quickly with low cost, especially when compared to usability testing, as well as the ability to apply the method early in the design phases, before coding even begins. For complete testing of a product we have three major questions for each step and we should be able to answer them.

Questions for each step: 1. “Will the correct action(s) be evident to the users?” 2. “Will the users connect the label of an action with their goals?” 3. “Will the user receive a sensible feedback?”

3.1.2 Heuristic evaluation

A heuristic evaluation is a usability inspection method for computer software that helps to identify usability problems in the user interface (UI) design. It specifically involves evaluators examining the interface and judging its compliance with recognized usability principles (the "heuristics"). These evaluation methods are now widely taught and practiced in the new media sector, where UIs are often designed in a short space of time on a budget that may restrict the amount of money available to provide for other types of interface testing.

There some conditions of heuristic evaluation, that must 100% accomplished: 1. Visibility of system status 2. Match between system and the real world 3. User control and freedom 4. Consistency and standards 5. Error prevention 6. Recognition rather than recall 7. Flexibility and efficiency of use 8. Aesthetic and minimalist design 9. Help users recognize, diagnose, and recover from errors 10. Help and documentation A7B39TUR 4. App testing 4.1 Sign in with existing account

Step 1 - Launch app If you launch Feedly app firstly on your iPhone, you will see the invitation screen of app.

Step 2 - Swipe up As we can see above, the invitation screen has little tip what to do next. Lets do this thing.

A7B39TUR Step 3 - Personalize If you have an Google or Facebook account, you can simply log in. I have a Facebook account, so I will click a button called «Personalize with Facebook» and confirm the access to my Facebook data. After confirming I was returned to the main page of app.

4.1.1 Cognitive walkthrough results

Q1 Q2 Q3

Step 1 YES YES NO

Step 2 YES YES YES

Step 3 YES YES YES

4.1.2 Heuristic evaluation results 100% accomplished. A7B39TUR 4.2 Searching items

In our case items would be news or blogs, depends on user’s preferences.

Step 1 - Open search bar Assume, we have already signed in and we get this view as a default after application launching. Click the right bar item (search icon).

Step 2 - Typing a text While we typing some characters in search bar, we get some «help phrases» for better searching. A7B39TUR Step 3 - Get results Press «Search» button to hide these «help phrases» and stop searching.

4.2.1 Cognitive walkthrough results

Q1 Q2 Q3

Step 1 YES YES YES

Step 2 YES NO NO

Step 3 YES YES YES

4.2.2 Heuristic evaluation results 100% accomplished. A7B39TUR 4.3 Add items to collection

To provide this use case, we should include steps from the previous chapter 4.2, because we have no another way how to add items to our own collection. So, we just press «+» button and a new view will appear.

Step 1…3

Step 4 - Create new collection It is difficult to say where the button is, but lets to tap «Create new collection». Oh! It works! So, type a name of our collection and click «Create». The chosen item will be added to collection, but no response we get.

4.3.1 Cognitive walkthrough results

Q1 Q2 Q3

Step 1 YES YES NO

Step 2 YES NO NO

Step 3 YES YES YES

Step 4 NO NO NO A7B39TUR 4.3.2 Heuristic evaluation results 3th condition is not accomplished. Reason: user is not recognised about provided actions. 8th condition is not accomplished. Reason: design is too minimalistic. 10th condition is not accomplished. Reason: no help for important steps.

4.4 Items sharing

Step 1 - Choosing an item Choose an item to see full information about it.

Step 2 - Open sharing view Tap the «three dots» icon in right-up corner.

A7B39TUR Step 3 - Choosing social media Click the button with preference social media to share item. For example, click icon of Twitter.

Step 4 - Item posting Add some description and press «Post» button, but no response we get again. A7B39TUR 4.4.1 Cognitive walkthrough results

Q1 Q2 Q3

Step 1 YES NO NO

Step 2 NO YES NO

Step 3 YES YES YES

Step 4 YES YES NO

4.4.2 Heuristic evaluation results 7th condition is not accomplished. Reason: not flexibility. 10th condition is not accomplished. Reason: no help for important steps. A7B39TUR 5. Summary 5.1 Findings

№ Problem Solution Priority

1 Interface. It is really difficult to find out how to Move option to application settings. High change a language of news/materials. This option can be found at the bottom of the page with search bar.

2 Interface. «Three dots» icon is also make Change icon on another one. Middle some problems with comprehension.

3 Add some borders or apply some colors are Add some borders or apply some colors Middle differed from background. are differed from background.

4 Bugs. Some stops and bugs while using Code fixing and optimization. Middle application. Low

5 Interface. «Logout» button is merged with Change the color of this button Low another button such as «Settings», «Connections», «Switch Theme»

5.2 Conclusion

Feedly is a good application with minimalistic and flat design, which makes reading really simple and comfortable on your device. You don’t need to read manuals about using this application, but some things complicate usage because of interface flaws.