SLICKPIC MOBILE TESTING Srividya Narayanan Madhuri Gurrala 080311

SLICKPIC MOBILE TESTING Srividya Narayanan Madhuri Gurrala 08/03/11

AGENDA Ø Introduction Ø Slick. Pic App • Installation • Released Features • Features under development/testing Ø Summary Ø QA's Role in Slick. Pic • Mobile App • QA Process followed • Issues explained • Conclusion

INTRODUCTION ØWhat is an App? Ø Scope of Slick. Pic Mobile testing • O/S – Mac OS X • Browser – Safari 5. 0 • Mobile devices - i. Pod Touch, i. Phone, i. Pad

INSTALLATION Ø From App store • Search for Slick. Pic in i. Tunes • Enter your i. Tunes password to install the App on your mobile devices

ØFrom i. Tunes (. ipa file) • Connect mobile device to i. Tunes • Copy. ipa file to Apps folder

Sync i. Tunes and mobile device to complete installation

RELEASED FEATURES ØSlick. Pic Login • Create new account or use existing account

Home Screen My Gallery

Add new albums Share albums

FEATURES UNDER DEVELOPMENT/TESTING Ø Share individual photos via email Ø Send photos for enhancement

SUMMARY ØInstalled multiple versions of Slick. Pic App • Released version • Development/Production version Ø Challenges while installing App – cannot have both versions of the App in the same mobile device at the same time

COMING UP NEXT. . QA's role in Slick. Pic presented by Madhuri Gurrala

THE Slick. Pic App. . An approach from QA perspective, by Madhuri Gurrala

MOBILE APP • As of now, Slick. Pic is an i. Phone app. • App : short for Application. • A mobile App is essentially a software program that runs on a hand-held device (phone, tablet, i. Pod etc). • A mobile app can be a native app or a web app. NATIVE APP MOBILE APP WEB APP

Native App • When you say mobile app, people assume you mean native app. • A native app is a program that runs on a hand-held device which has a "smart" operating system that supports standalone software and can connect to internet via wifi or a wireless carrier network. • Native mobile apps can be downloaded from app stores such as the Apple app store (like the Slick. Pic app) or the Android market. • A native app is "native" to one type of mobile operating system like i. OS, Android, Blackberry, Symbian, Windows Phone, etc. Hence an i. Phone app works only on i. OS devices and so on. • So, building a native mobile app is a serious undertaking in terms of developer resources, time and money.

Web App • A mobile web app is more or less like any other website, optimized for viewing on a mobile device's web browser. • A mobile web app uses technologies such as Java. Script or HTML to provide interaction, navigation or customization. • A mobile web app is delivered wholly on the go. • Mobile web apps need no "approval process" from the App store. • Slick. Pic was started as a web application, later decided to go mobile. • Though at this point, Slick. Pic is available only on Apple app store, they plan to develop it for Android market too.

As a QA professional, make sure to remember a few more things about mobile apps before taking the leap into testing , • Mobile is the platform that people can have with them everywhere and at anytime. This is an exciting concept for both businesses and users. • A well designed app helps companies to keep up with times and present with new ways to increase profits. • A positive first impression is essential to relationships. Initially, a lot depends on the impression an app makes on the user. • Though amazing visuals attract customers by making a great first impression, a long-lasting relationship depends on the quality of each encounter. • An app with stunning looks but poor performance can damage trust and integrity. • If the app is not fast and responsible, it yields bad reviews and poor ratings, thus low adoptions.

Navigation controls Now, let's get familiar with the navigation on i. Phone/i. Pod. You need this to venture into mobiles. Here a few scrolling tips: • When viewing pages within the browser(Safari), to scroll a page, place your finger on the screen and move it up or down quickly. • Tap once on the screen to stop the scrolling action. • Double tap towards the bottom of the screen to navigate to the end of the page you are viewing. • To navigate to the top, double tap the top of the screen below the time display. • To manually zoom in, put your thumb and forefinger on the screen and move them apart. • Pinch your fingers together to zoom out. • Certain apps allow you to change screen orientation from portrait to landscape, simply by turning your device on its side - known as mode shift

And then if you have to take a screenshot, here's how you do it on i. Phone/i. Pod/i. Pad : 1. Briefly hold the "Home" down and while it is still down, press the Power button. 2. The screen flashes momentarily, indicating that the screenshot has been captured. 3. Open the Photos app on your device to see the saved screenshot in "Camera Roll" or photo album.

Empowered with this basic knowledge, let's get into real QA. Slick. Pic App is developed using Agile methodology, therefore, QA has a profound role to play. This is evident from how we have tested the app. This is how the app looks after you login,

QA PROCESS FOLLOWED A word on the practices and the sequence of steps we follow in QA for Slick. Pic app: 1. The development team communicates with QA through bi-weekly meetings, Release Notes and Mantis. 2. When a new feature is released or changes are made to an existing feature, there is "Release Notes" which provides us with a list of latest changes with all the updates on development side. 3. The chronology of changes with all the details is recorded in Mantis. Slick. Pic is Agile. Hence, to QA, Release Notes and Mantis are like oases in a desert. The issues I discuss here all taken from the Release Notes. Here is the screenshot that shows how the Release notes issues and our reports on each issue look.

ISSUES EXPLAINED Issue 1: i. Phone Zoom doesn't expect the rotation at the same time. (as appeared in Release notes) Description: When a photo is zoomed in/out, rotation is not allowed. Steps to test: 1. Confirm that appropriate version of Slick. Pic i. Phone app is installed on your device. 2. Login to your account. 3. Tap My. Photos button. 4. Make sure you are in My. Gallery. 5. Tap an album to select. 6. Tap a single photo to open it. 7. Put your index finger together with your thumb and place them on the part of the photo that you want to zoom in on. Then, drag your fingers apart, sending each one towards the opposite edge of the screen. This zooms in on page. 8. Try to rotate the photo by rotating only the fingers and not the device. 9. See that the photo can only be zoomed in but cannot be rotated. 10. To zoom out of the page, put your fingers at opposite ends of the screen and drag them towards each other, meeting in the center of the screen. 11. Repeat step 8 when photo is zoomed out and expect the photo zoomed out but cannot be rotated. Result: Pass in i. Phone/i. Pod/i. Pad.

Issue 2: i. Phone application. Changes 1 -2. "Back" button looks different on certain devices. Description: The built-in "Back" button doesn't look the same on all devices. QA needs to verify this and capture screenshots. Steps to Test: 1. When logged into Slick. Pic, 2. Tap "My. Photos“ 3. Tap an album. 4. Locate "Back" button on the screen. 5. Take a screenshot. (Briefly hold down the "Home" button on the front of your device. While it's down, press the "Sleep/Wake" button on the top and a screenshot of the existing screen will get saved to your photos folder. The screen will flash momentarily to indicate that a screenshot has been captured. )

Conclusion: Looks like it is an i. OS version 5 issue. Issue to be dealt with later.

Issue 3: "Share Photo/Album" Functionality Synopsis: Slick. Pic i. Phone App share functionality is all about sharing a Slick. Pic photo/album and is one of the core features. It took quite a few iterations to evolve to this point as seen in the app now. The testing ranged from ad hoc to functional to regression and has influenced the app's design as well. Steps to test: 1. Log into Slick. Pic account 2. Tap My. Photos. 3. Tap a public album. 4. Tap to open a photo. Make sure the controls are visible. 5. Press the icon in the top right corner (square with arrow coming out of it) and see that a menu pops up. Please note this in the screenshots below. (Steps continued. . )

6. Select email this photo. 7. Enter a valid email. 8. Compare the text in Subject line and the body of the email with the notes in Mantis. 9. Notice any mismatch. 10. Capture the screenshot. 11. Tap Send.

12. Tap Back. 13. From My. Gallery select an unlisted album. 14. Repeat steps 4 -11. 15. Report any mismatch. 16. Tap Back button. 17. From My. Gallery, select a private album. 18. Repeat steps 4 -6 for a private album. 19. Remember that private album can't be shared and hence note the error messages and check if they are appropriate.

In the recipient email, verify if the photo/album is shared as desired. Verify the look, text and links and functionality.

QA team's Report on Share functionality: 1. Sharing a single photo through "Email this photo" option works fine 2. "Share this Album" option is available when an album is selected and also when an individual photo is selected. When shared, in the recipient's email, album doesn't open when clicked on the thumbnail. 3. Doesn't prompt for password protection enabled albums. 4. For private albums and photos, share options are still displayed and when tapped on the option, no message is displayed. Can we display message like in slickpic. com: "This is private album and cannot be shared. . "? 5. When an error message is displayed, there are 2 buttons (Ok and Cancel). Isn't just "OK" enough? 6. Also, for sharing both the album and photo, the default subject line in the email says, "I'm sharing new i. Phone photo. . ". This sentence could be different when sharing the album.

Issue 4: "Submit for Edit" Functionality Description: Slick. Pic app allows the user to submit photos for Enhancement. QA to test the functionality and UI. Steps to test: 1. Log into Slick. Pic account 2. Tap My. Photos. 3. Tap a public album. 4. Tap to open a photo. Make sure the controls are visible. 5. Press the icon in the top right corner (square with arrow coming out of it) and see that a menu pops up. 6. Select(tap) "Send for Enhancement". 7. Notice the look, user-friendliness, consistency and the functionality. (If you are familiar with the web application Slick. Pic, you'll see that there is a difference in the screens. Guess why? )

Here are the screenshots that show it looks after you submit for Enhancement.

CONCLUSION This is just a glimpse of the issues in testing Slick. Pic app. You may get a deeper understanding by looking at our Release notes and Mantis. Resources: http: //www. ehow. com/info_8712790_iphone-navigation-tips. html Refer to standards for mobile web applications at http: //www. w 3. org/TR/mwabp/