2. TEST AUTOMATION FOR MOBILE
ON REAL IOS AND ANDROID DEVICES
Appurify is a web-based application that provides mobile developers with the flexibility to test their
mobile apps on a variety of locations, memory conditions, networks, and real devices.
PRODUCT DESCRIPTION
3. Clickable Prototype : http://invis.io/8CJ5IYDH
Dashboard
My Apps
API Docs
Tools
Dashboard
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
Help Getting Started
Dashboard
Setup a Test for Phone Browser Demo
1. PICK A BUILD OF YOUR APP
BUILD #10-12_2
Uploaded 1 hour ago
BUILD #10-10_3
Uploaded yesterday
ONBOARDING
STABLE SUSIE
Tools
user@gmail.com
MY FILES
RESULTS
Dashboard
BUILD #10-12_1
Uploaded 1 year ago
2G
Uploaded yesterday
3G
4G
Automaton4
9 days ago
20 test runs
SpecificTest.js
TeSting.js
15 days ago
12 test runs
more info
2 monts ago
9 test runs
3. PICK DEVICES TO TEST ON
5. ENTER LOCATION
IOS ROBOT - Default
PICK MEMORY LEVEL
intelligently crawls and tests
your app
AUTOMATION.JS
Uploaded 2 hours ago
STABLE SUSIE
LTE
Uploaded 1 month ago
SUITE-E.JS
Uploaded last month
DSL
OR SELECT ANOTHER BUILD
Click or drag and drop to
upload a new builds, test
suites, or apps
OR
iPad UPLOAD A NEW APP
Android Tablets
ADVANCED OPTIONS
2. PICK A TEST SUITE
EDGE
JS
190
Uploaded 2 hours ago
JS
SPECIFICTEST.JS
Uploaded 1 year ago
OR SELECT ANOTHER TEST
ADVANCED OPTIONS
MyCuteFriend
HabitRPG
RUN
Builds
5 test runs
Uploaded 8 days ago
iOS Robot
2 hours ago
SpecificTest.js
Yesterday
iOS Robot
Yesterday
iOS Robot
8 days ago
BUILD 2
2 test runs
3 test runs
Applications
Applications
Uploaded 11 days ago
BUILD 1
UIAutomation1
1 hour ago
BUILD 3
Uploaded 13 days ago
Select a test suite...
SETUP TEST
MY FILES
CORE SCREENS & PROTOTYPE
Phone Browser
Demo
MyCuteFriend
(MB) 0iPhone/iPod
125
250 Android
275
Phones
500
OR
Use default memory of device
Enter address, zip, city or region
Phone Browser
Demo
Android Phones
SPECIFICTEST.JS
Applications
BUILD #10-10_3
Test Suites
iPhone/iPod
Uploaded last month
user@gmail.com
SUITE-E.JS
4. PICK A NETWORK TO TEST IN
BUILD #10-12_2
OVERVIEW
Tools
Uploaded 2 hours ago
OR SELECT Test for
OR SELECT ANOTHER
Setup a ANOTHER BUILDPhone Browser DemoTEST
Uploaded 1 hour ago
API Docs
AUTOMATION.JS
1. PICK A BUILD OF YOUR APP
Photo Browser Demo
-
Default
intelligently crawls and tests
Uploaded 1 month ago
API Docs
IOS ROBOT
3. PICK DEVICES TO TEST ON
My Apps
your app
Uploaded 2 hours ago
OR UPLOAD A NEW APP
2. PICK A TEST SUITE
Dashboard
BUILD #10-12_1
Don't have one of these? Use our sample app
UIAutomation1
6 days ago
10 test runs
user@gmail.com
Tools
Step-by-step tutorial & video
Acceptable formats:
.ipa & .zip
API Docs
Submit
your first app and start testing!
My Apps
http://example.com/
Click or drag and drop to upload
Dashboard
My Apps
HabitRPG
DASHBOARD
iPad
Android Tablets
5. PROBLEM SPACE
Although potential users are
excited about the product, many
users currently drop off when
they are asked to upload their first
app or run their first test. Through
usability testing, we were able to
discover which specific obstacles
developers were running into.
OPPORTUNITIES IDENTIFIED
• Make the onboarding process
more clear
• Simplify the steps needed to
upload and run a test while
still informing the users of the
impressive features unique to
Appurify
DESIGN RESEARCH
8. Sign in
Add a build
Add a test
Setup & run test
View results
(in progress)
CURRENT APP
9. Sign in
Add a build
Add a test
Setup & run test
View results
(complete)
CURRENT APP
10. METHODS
After defining the existing user journey,
we looked at analogous inspirations
of simple flows for onboarding, adding
files, and setting up a complex process.
Sign in
FINDINGS
• linear, guided onboarding process of
Flinto.
• easy-add on dashboard in Pinterest;
• uninterrupted, focussed form flow in
Typeform;
Add a build
Add a test
OPPORTUNITIES
Apply tested UI patterns to simplify the
task flow for testing an app on Appurify
Setup & run test
View results
SKETCHES & INSPIRATIONS
11. We started applying UI patterns
to existing functionality and
sketching ideas for uploading an
app and running a test.
The process was simplified and
made clearer by strategically
hiding and showing information.
IDEATION SKETCHES
12. METHODS
Streamlined
and
digitized
wireframes.
Went on to user test with some
developers and got feedback
from client
FINDINGS
• Navigation
still
needed
further simplification.
• Some terms needed to be
redefined like test, test run,
test script, test suite and run
a test, setup a test run, create
a test etc.
• Visual
styling of results
needed more work, and
technical feasibilities taken
into account
OPPORTUNITIES
Re-look at the flow, visual
styles and categorization
DESIGN ITERATION 1: PROTOTYPE
16. •
•
Dashboard My Apps
Dashboard My Apps
API Docs
Tools
user@gmail.com
1 day ago
4 Test Suites
Travel Lite iPhone App
10 days ago
2 Test Suites
10 days ago
1. PICK A BUILD OF YOUR APP
OrderSmarter
OrderSmarter
5 Builds
22 days ago
3 Test Suites
2. PICK A TEST SUITE
3. PICK DEVICES TO TEST ON
22 days ago
3 Test Suites
Decision Loop
2 Builds
Phone Browser Demo
2 Test Suites
MY FILES
API Docs
SETUP A TEST FOR PHONE BROWSER DEMO
8 Builds
Travel Lite iPhone App
8 Builds
RESULTS
user@gmail.com
1 day ago
4 Test Suites
Phone Browser Demo
5 Builds
Tools
3 Builds
Phone Browser Demo
3 Builds
1 month ago
OVERVIEW
Build #10-12_2
Uploaded 1 hour ago
4 Test Suites
Decision Loop
2 Builds
1 month ago
iOS Robot
4 Test Suites
Default
intelligently crawls and tests your app
BUILDS
BUILD 3
Uploaded 8 days ago
UIAutomation3.2
4 days ago
Or drag and drop
to upload a new
build
Click or drag and drop new
test suites, or builds to add
UIAutomation3.1
4 days ago
UIAutomation2
Or drag and drop
to upload your
own test script
more info
5 test runs
more info
iPhone/iPod Android Phones
6 days ago
iPad
Android Tablets
UIAutomation1
6 days ago
iOS Robot
Select a test suite...
8 days ago
Advanced Options
Setup test run
•
Redesigned navigation.
Placed ‘Setup a test’ process
on the dashboard for easy
access.
Designed the ‘Setup a test’
flow as a 3-step process, with
advanced options.
Categorized tests and builds
into my files for easier
understanding for users as
they upload files.
BUILD 2
2 test runs
BUILD 1
3 test runs
RUN
Uploaded 11 days ago
•
Uploaded 13 days ago
TESTS IN-PROGRESS
+ Upload a new build
TEST SUITES
RECENTLY COMPLETED TESTS
JS
JS
UIAutomation1
UIAutomation2
UIAutomation3.1
UIAutomation3.2
6 days ago
6 days ago
4 days ago
4 days ago
+ Upload another test suite
DESIGN ITERATION 2: PROTOTYPE
Build
#10-12_2
Test Suite
iOS Robot
Device
iPhone 5
OS Version
iOS 6.1.4
#10-12_2
iOS Robot
iPhone 5
iOS 7.0
#10-12_2
iOS Robot
iPhone 4S
iOS 6.1.3
#10-12_2
iOS Robot
iPhone 4S
iOS 6.1.2
18. QA Manager (if available)
Runs automated test for quality check,
checks results,
provides feedback to developer to fix code
Appurify Cloud
Developer
Develops app, writes test script,
runs automated test,
checks results,
fixes bugs and crashes
USER ROLES
Runs test as per configuration
gives and saves results in the form of
visuals and error logs
19. OR
Developer QA Manager
dd
a
logins to
&
ss
ce
ac
view
setup
DASHBOARD
ad
d
APP
BUILDS
&
ac
ce
ss
TEST
SCRIPTS
CONCEPT MODEL
view & access
s
cces
&a
TEST
RUN
TEST
RESULTS
et
g
20. Marketing site
SIgn Up
Sign In
Dashboard
First run: Welcome, Upload app
Dashboard
Returning user
Setup a test run
My Applications
My Apps-Individual App
Recent Results
Test Run Results
Individual Result
SITE MAP
My Files
Overview
21. Dashboard
My Apps
Click or drag and drop to upload
your first app and start testing!
API Docs
Tools
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
A
B
Submit
Acceptable formats:
.ipa & .zip
Help Getting Started
Step-by-step tutorial & video
A Drag in area to upload app
Hover over - Darkens grey box
Click - opens file browser,
Drag and drop app file - Starts
app upload process
C
B iOS Selenium Test
Type in URL, hit Submit to test
Don't have one of these? Use our sample app
C Help button
Leads user to a Tutorial or
Sample app test process
CORE SCREEN 1 : UPLOAD AN APP
22. Dashboard My Apps
API Docs
Tools
Dashboard My Apps
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
Submit
Help Getting Started
Step-by-step tutorial & video
Tools
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
Click or drag and drop to upload
your first app and start testing!
API Docs
http://example.com/
Submit
Click or drag and drop to upload
your first app and start testing!
Help Getting Started
Step-by-step tutorial & video
+
Acceptable formats:
.ipa & .zip
Acceptable formats:
.ipa & .zip
Dashboard My Apps
Woops, looks like that’s a format
we don’t support.
API Docs
Tools
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
Submit
Help Getting Started
Step-by-step tutorial & video
Acceptable formats:
.ipa & .zip
Cats.png
Don’t have one of these? Use our sample app
1
Sign in - First run
Dashboard My Apps
API Docs
Tools
Dashboard My Apps
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
Submit
Woops, looks like that’s a format
we don’t support.
Acceptable formats:
.ipa & .zip
2 Incorrect format file
dragged in
Phone
Browser
Demo.ipa
Help Getting Started
Step-by-step tutorial & video
+
3 Clear error message
API Docs
Tools
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
Submit
Help Getting Started
Step-by-step tutorial & video
5.4 MB
Phone Browser Demo.ipa
Phone
Browser
Demo.ipa
API Docs
Tools
user@gmail.com
You can also run iOS Selenium tests
against one or more URLs.
Start by adding the primary url below:
http://example.com/
Submit
Help Getting Started
Step-by-step tutorial & video
5.4 MB
Setup your first test
Don’t have one of these? Use our sample app
4 Correct format app file
dragged in
Dashboard My Apps
5 Square fills in from bottom to
top as app uploads
TASK FLOW 1 : UPLOAD AN APP
6 Square complete blue when
app is uploaded,
active green button appears:
‘Success! Run your first test”
23. Dashboard
My Apps
API Docs
user@gmail.com
Tools
A
B
Setup a Test for Phone Browser Demo
1. PICK A BUILD OF YOUR APP
BUILD #10-12_2
Uploaded 1 hour ago
2. PICK A TEST SUITE
Dashboard
BUILD #10-12_1
IOS ROBOT
BUILD #10-10_3
Uploaded yesterday
STABLE SUSIE
Dashboard
A
B
iPhone/iPod
E
C
SPECIFICTEST.JS
OR
iPad UPLOAD A NEW APP
Android Tablets
D
5. ENTER LOCATION
IOS ROBOT - Default
EDGE
2G
Uploaded yesterday
3G
4G
PICK MEMORY LEVEL
intelligently crawls and tests
your app
AUTOMATION.JS
E
Uploaded 2 hours ago
LTE
Uploaded 1 month ago
OR SELECT ANOTHER BUILD
F
SUITE-E.JS
Uploaded last month
STABLE SUSIE DSL
SPECIFICTEST.JS
Uploaded 1 year ago
OR SELECT ANOTHER TEST
(MB) 0iPhone/iPod
125
250 Android
275
Phones
500
Use default memory of device
iPad
Android Tablets
H
Run button
Gets activated once options A,B,C are selected. On click, user is taken to My
Apps>Results page.
ADVANCED OPTIONS
MyCuteFriend
HabitRPG
RUN
Applications
Applications
Phone Browser
Demo
Pick memory level
Slide over to set memory level with visual cues (red, yellow, green) for memory
definition. Slider bar fills in to lower transparency as the slider control is moved
G
OR
Enter address, zip, city or region
Phone Browser
Demo
Enter location
As user starts typing a location or zipcode, auto-suggest options. Selection of
an option would lead to reloading of the map with the pin at selected location
3. PICK DEVICES TO TEST ON
190
Applications
BUILD #10-10_3
F
Uploaded 1 year ago
ADVANCED OPTIONS
2. PICK A TEST SUITE
Pick network
Click on one of the 6 categories around the center - gives options in the
center for single selection. Highlighted spotlight path indicates which option
is selected. Clicking on another category would lead to selection spotlight
rotating around the center to selection
G
Android Phones
Uploaded last month
Uploaded 2 hours ago
Advanced Options
Clicking this link reveals E,F,G.
user@gmail.com
SUITE-E.JS
4. PICK A NETWORK TO TEST IN
BUILD #10-12_2
Tools
Uploaded 2 hours ago
1. PICK A BUILD OF YOUR APP
BUILD #10-12_1
API Docs
AUTOMATION.JS
OR SELECT Test for
OR SELECT ANOTHER
Setup a ANOTHER BUILDPhone Browser DemoTEST
Uploaded 1 hour ago
Pick devices to test on
Click on one of the four categories - pop up appears with options to multiselect different devices and OS.
-
Default
intelligently crawls and tests
Uploaded 1 month ago
C
3. PICK DEVICES TO TEST ON
My Apps
your app
Uploaded 2 hours ago
OR UPLOAD A NEW APP
Pick a test suite
Three most recently uploaded test suites appear on the list along with iOS
Robot. Previous test suites can be selected from the drop down menu at the
bottom of the list.
D
Dashboard
Pick a build
Three most recent builds, along with any others favorited by the user appear
in the list. Any previous builds can be selected from the drop down menu at
bottom of the list.
MyCuteFriend
H
I
HabitRPG
CORE SCREEN 2 : SETUP A TEST
I
My Apps
Direct access to apps - clicking on any one takes user to My Apps>Results page.
24. Dashboard
My Apps
Dashboard
API Docs
Tools
My Apps
user@gmail.com
API Docs
Setup a Test for Phone Browser Demo
OR UPLOAD A NEW APP
2. PICK A TEST SUITE
iOS 6.1.4
iOS 6.1.3
iOS 6.1.2
BUILD #10-12_2
Or drag and drop to upload
a new build
iPhone/iPod
Android Phones
OR UPLOAD A NEW APP
3. PICK DEVICES TO TEST ON
Tools
user@gmail.com
1. PICK A BUILD OF YOUR APP
2. PICK A TEST SUITE
iOS 7.0
iOS 6.1.4
iOS 6.1.3
iOS 6.1.2
IPOD 5
Or drag and drop to upload
your own test script
iPhone/iPod
Android Phones
iOS 7.0
iOS 6.1.4
iOS 6.1.3
iOS 6.1.2
3. PICK DEVICES TO TEST ON
IOS ROBOT Default
Uploaded 1 hour ago
intelligently crawls and tests your app
OR UPLOAD A NEW APP
intelligently crawls and tests your app
Or drag and drop to upload
a new build
iPhone/iPod
Android Phones
Or drag and drop to upload
your own test script
more info
more info
more info
more info
more info
iPad
iPad
iPad
Android Tablets
ADVANCED OPTIONS
ADVANCED OPTIONS
RUNcancel or
RUN
SAVE
MyCuteFriend
HabitRPG
Applications
After uploading app, user
is taken to a simple 3-step
process where they can pick
builds, test suites (or test
with iOS Robot) and devices.
Selected state for builds and
test suites is a filled in blue
box, unselected state would
have only the stroke blue
Phone Browser
Demo
MyCuteFriend
HabitRPG
2 On clicking a device, pop up
appears with different models
and operating systems of that
device for multi-selection.
After checking the boxes, user
hits the ‘Save’ button to save
selection for the test run.
TASK FLOW 2 : SETUP A TEST
RUN
Please pick at least one
device to test on!
Applications
Applications
Phone Browser
Demo
Android Tablets
Android Tablets
ADVANCED OPTIONS
1
API Docs
Setup a Test for Phone Browser Demo
BUILD #10-12_2
IOS ROBOT Default
IPHONE 4
Or drag and drop to upload
a new build
Or drag and drop to upload
your own test script
more info
iOS 7.0
iOS 6.1.4
iOS 6.1.3
iOS 6.1.2
2. PICK A TEST SUITE
Uploaded 1 hour ago
intelligently crawls and tests your app
3. PICK DEVICES TO TEST ON
IOS ROBOT Default
Dashboard
IPHONE 4S
Setup a Test for PhoneiOS 7.0
Browser Demo
1. PICK A BUILD OF YOUR APP
Uploaded 1 hour ago
My Apps
3. PICK DEVICES TO TEST ON
IPHONE 5
BUILD #10-12_2
Dashboard
user@gmail.com
Dashboard
Dashboard
1. PICK A BUILD OF YOUR APP
Tools
Phone Browser
Demo
MyCuteFriend
HabitRPG
3 Once options for first three
steps are selected, ‘Run’
button gets activated in red.
On clicking Run, user is taken
to My Apps>Results page.
25. Dashboard
My Apps
Tools
user@gmail.com
App Navigation: My Files
Builds are listed in an accordion with most recent results, simple visual
indicating results, details about test runs on the build, upload days. When a
menu is expanded, option to edit or delete appear on the same bar as icons.
Test suites
Test suites appear as uploaded files with format icons to make them easily
identifiable. Once selected, there would be a blue stroke. Cross to delete
appears on top right of the file icon, and file is clickable to download/view
C
Easily add test suite or build for the app
Drag in area for new test suite or build, similar to welcome screen
D
API Docs
A
B
Setup a test
Select a test suite from the dropdown and hit setup test run to test the
selected build.
E
Other Builds
Previous builds are collapsed - Visible details are number of test runs and
upload days.
Photo Browser Demo
MY FILES
RESULTS
Test Suites
OVERVIEW
A
B
JS
JS
C
Click or drag and drop to
upload a new builds, test
suites, or apps
UIAutomation1
6 days ago
10 test runs
Automaton4
SpecificTest.js
TeSting.js
9 days ago
20 test runs
15 days ago
12 test runs
2 monts ago
9 test runs
more info
Builds
5 test runs
Uploaded 8 days ago
iOS Robot
2 hours ago
SpecificTest.js
Yesterday
iOS Robot
Yesterday
iOS Robot
8 days ago
BUILD 2
2 test runs
Uploaded 11 days ago
BUILD 1
3 test runs
Uploaded 13 days ago
UIAutomation1
1 hour ago
BUILD 3
Select a test suite...
SETUP TEST
D
E
CORE SCREEN 3 : SINGLE APP>MY FILES
26. Dashboard My Apps
API Docs
Tools
Phone Browser Demo
RESULTS
MY FILES
C
Sort by category
The test results can be sorted easily by build, test suite, device or OS version in
a grid
B
Hover over Single result
Turns dark grey, shows time of test completion and option to delete test result
C
Test status
Failed/passed icons and text colour indicate test status. All results are clickable
leading to individual results
A
OVERVIEW
Build
10/29/13
4:54 PM
A
user@gmail.com
Test Suite
Device
OS Version
#10-12_2
iOS Robot
iPhone 5
iOS 6.1.4
#10-12_2
iOS Robot
iPhone 5
iOS 7.0
#10-12_2
iOS Robot
iPhone 4S
iOS 6.1.3
#10-12_2
iOS Robot
iPhone 4S
iOS 6.1.2
#10-12_1
iOS Robot
iPhone 5
iOS 6.1.4
#10-12_1
iOS Robot
iPhone 5
iOS 6.1.4
#10-12_1
iOS Robot
iPhone 5
iOS 6.1.4
#10-12_1
iOS Robot
iPhone 5
iOS 6.1.4
#10-10
iOS Robot
iPhone 5
iOS 6.1.4
#10-10
iOS Robot
iPhone 5
iOS 6.1.4
#10-10
iOS Robot
iPhone 5
iOS 6.1.4
#10-10
iOS Robot
iPhone 5
iOS 6.1.4
B
CORE SCREEN 4 : SINGLE APP>RESULTS
27. Q&A
Shivangi Mehra
UX Designer
Maya Wagoner
UX Designer
Currently studying Experience
Design at General Assembly, San
Francisco, with work experience in
Architecture, Landscape Design,
and Visual Design (Print, Web,
Marketing collaterals).
A current student of Experience
Design at General Assembly and
a longtime student of the world.
Experienced with systems design
and working with small teams on
social web apps and civic projects.
A design enthusiast, I love to travel
and find inspiration at every step!
shivangijainmehra@gmail.com
(650) 532-4691
www.blusquaredesigns.com
t @shivangijmehra
mayawagon@gmail.com
(310) 738-6857
t @mayamayaw