HeaderSIS.jpg

Difference between revisions of "IS480 Team wiki: 2012T2 Viaxeiros Application Development"

From IS480
Jump to navigation Jump to search
()
 
(20 intermediate revisions by 5 users not shown)
Line 2: Line 2:
 
[[Image:Viaxerios_Logov1.png|300px|center]]
 
[[Image:Viaxerios_Logov1.png|300px|center]]
  
===<center><b><font size="5">''Welcome to Viaxeiros FYP Wiki Page''</font></b></center>===
+
<center><b><font size="5">''Welcome to Viaxeiros FYP Wiki Page''</font></b></center>
 
<imagemap>
 
<imagemap>
  
Line 16: Line 16:
 
rect 1467 247 1597 326  [[IS480_Team_wiki:_2012T2_Viaxeiros_Learning_Outcomes|]]
 
rect 1467 247 1597 326  [[IS480_Team_wiki:_2012T2_Viaxeiros_Learning_Outcomes|]]
 
rect 1346 17 1488 153[[IS480_Team_wiki:_2012T2_Viaxeiros_Mid_Terms|]]
 
rect 1346 17 1488 153[[IS480_Team_wiki:_2012T2_Viaxeiros_Mid_Terms|]]
 
+
rect 1503 29 1638 146[[IS480_Team_wiki:_2012T2_Viaxeiros_Final|]]
  
  
Line 30: Line 30:
  
 
</imagemap>
 
</imagemap>
 +
 +
 
<!------------------------------------User Requirements Analysis--------------------------------------->
 
<!------------------------------------User Requirements Analysis--------------------------------------->
  
{| cellspacing="0px" cellpadding="0" style="width:100%; background:white;"
+
<div id="UserRequirement" style="padding:0px; text-align: right; margin-bottom:0px;"  align="center"></div>
| style="width:100%; vertical-align:top; border:1px solid #EE8833; background:#FFF0E0;"|
+
{| cellpadding="1" cellspacing="1" style="width: 100%; background-color: #ffffff; vertical-align: top; "
<div id="UserRequirement" style="border-bottom:1px solid #EE8833; background:#FFC469; padding:0.2em 0.5em; font-size:130%; font-weight:bold;">
+
| colspan="2" style="padding: 0;" |
User Requirements Analysis</div>
+
|-
<div style="padding:0.4em 1em 1em;">
+
| style="width: 100%; vertical-align: top;"  align="center" |
 +
{| border="0" cellspacing="0" cellpadding="0" width="100%"
 +
| style="background-color:#ffffff;" width="0" |
 +
{| style="width="30%"; font-size:95%; text-align: justify;" padding:-2px; background:FFFFFF" cellpadding="0" cellspacing="0"
 +
| rowspan="1" width="30%" colspan="2" height="37px" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; padding:0; padding-right:1em; margin:0; -moz-border-radius-topright:1em" | <div style="margin-top: -20px; padding-left:3px"></div>
 +
 
 +
<div  style="padding-left:10px; margin-top:36px; font-size:180%; font-family: Elephant;" >'''User Requirements Analysis'''</div>
 +
|}
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="8" | &nbsp;
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="100%"| &nbsp;
 +
|}
 +
{| style="width:100%; margin-bottom:.5em; font-size:95%; text-align: justify;" padding:-2px; background:#FFFFFF" cellpadding="0" cellspacing="0"  align="center"
 +
| rowspan="1" width="100%" colspan="2" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; border-top:0; padding:0; margin:0" |
 +
 
 +
{| cellspacing="0px"  align="center" cellpadding="0" style="width:70%; background:#e4fcfe;vertical-align:top;"
 +
| style="width:100%; vertical-align:top; border:1px solid #e4fcfe; background:#e4fcfe;"|
 +
|}
 +
 
 +
<div style="padding: 1em 1em 1em 1em; " align="center">
 +
{| style="width:100%; border: 1px solid darkgray;"
 +
|-
 +
|
 +
<br/>
 
'''''Survey 1'''''<br/>
 
'''''Survey 1'''''<br/>
  
Line 47: Line 71:
  
 
''Watch out for this space''<br/>
 
''Watch out for this space''<br/>
 +
 +
 +
 +
|}
 +
 
</div>
 
</div>
 +
 +
|-
 +
| colspan="2" class="radius_bottom" style="background:#ffffff; border-top:8px solid #7cc1c7; border-bottom:0px; border-left:1px; border-right:1px"|
 +
|}
 +
 +
===<!------------------------------------User Testing--------------------------------------->===
 +
 +
<div id="UserTesting" style="padding:0px; text-align: right; margin-bottom:0px;"  align="center"></div>
 +
{| cellpadding="1" cellspacing="1" style="width: 100%; background-color: #ffffff; vertical-align: top; "
 +
| colspan="2" style="padding: 0;" |
 +
|-
 +
| style="width: 100%; vertical-align: top;"  align="center" |
 +
{| border="0" cellspacing="0" cellpadding="0" width="100%"
 +
| style="background-color:#ffffff;" width="0" |
 +
{| style="width="30%"; font-size:95%; text-align: justify;" padding:-2px; background:FFFFFF" cellpadding="0" cellspacing="0"
 +
| rowspan="1" width="30%" colspan="2" height="37px" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; padding:0; padding-right:1em; margin:0; -moz-border-radius-topright:1em" |  <div style="margin-top: -20px; padding-left:3px"></div>
 +
 +
<div  style="padding-left:10px; margin-top:36px; font-size:180%; font-family: Elephant;" >'''Usability Tests'''</div>
 +
|}
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="8" | &nbsp;
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="100%"| &nbsp;
 +
|}
 +
{| style="width:100%; margin-bottom:.5em; font-size:95%; text-align: justify;" padding:-2px; background:#FFFFFF" cellpadding="0" cellspacing="0"  align="center"
 +
| rowspan="1" width="100%" colspan="2" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; border-top:0; padding:0; margin:0" |
 +
 +
{| cellspacing="0px"  align="center" cellpadding="0" style="width:70%; background:#e4fcfe;vertical-align:top;"
 +
| style="width:100%; vertical-align:top; border:1px solid #e4fcfe; background:#e4fcfe;"|
 +
|}
 +
 +
<div style="padding: 1em 1em 1em 1em; " align="center">
 +
{| style="width:100%; border: 1px solid darkgray;"
 +
|-
 +
|
 +
<br/><font face= "Elephant" size=4.8 color="#2f2929"> ''' Usability Test 1 (3rd - 6th January '13)''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #F5F5F5"|
 +
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' GOALS ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''1. Make sure all the new features are workable and ready for Deployment 1'''<br><br>
 +
'''2. Obtain feedback to improve the usability and performance of the App'''
 +
|}
 +
 +
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TEST SCOPE ''' </font>
 +
{| class="wikitable"
 +
|-
 +
! style="width:20pt; background:#ffee8b;" | <center>S/N</center> !! style="width:150pt; background:#ffee8b;" | <center>MAIN FUNCTION</center> !! style="width:250pt; background:#ffee8b;" | <center>FEATURES TESTED</center>
 +
|-
 +
| style="background:#feffcb;" | '''<center>1</center>'''|| style="background:#feffcb;" | '''<center>LOGIN</center>'''|| style="background:#feffcb;" | 
 +
*Facebook Login
 +
*Qiito Email Login
 +
|-
 +
| style="background:#fff2a4;" | '''<center>2</center>''' || style="background:#fff2a4;" | '''<center>DISCOVERY</center>'''|| style="background:#fff2a4;" | 
 +
*View Featured Travelogues
 +
*View Featured Places
 +
*View Featured Photos
 +
|-
 +
| style="background:#feffcb;" | '''<center>3</center>''' || style="background:#feffcb;" | '''<center>TRAVELOGUE</center>'''|| style="background:#feffcb;" | 
 +
*View My Travelogue Listing
 +
*View Individual Travelogue
 +
*View Individual Place in My Travelogue
 +
*Download My Travelogue
 +
*View Travelogue Offline (without map)
 +
*View Places in Travelogue Offline (without map)
 +
|-
 +
| style="background:#fff2a4;" | '''<center>4</center>''' || style="background:#fff2a4;" | '''<center>MEMORIES</center>'''|| style="background:#fff2a4;" | 
 +
*Capture Photos via Camera
 +
*Select a Photo via Gallery
 +
|}
 +
 +
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TESTING METHODOLOGY ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''Our participants for UT1 are mainly our close friends. Each of us would get a friend to conduct User Testing with.'''<br><br>
 +
'''Firstly, our team will brief them what our App is for. As our App has not been deployed yet, we will pass them our phone and a sheet of instructions consisting a set of scenario-based tasks. We would then sit beside them and observe how they interact with our application. We should not guide them unless they are confused or unsure how to proceed. '''<br><br>
 +
'''After they are done with the tasks, we will then give them a feedback form for them to fill up. '''
 
|}
 
|}
  
<!------------------------------------User Testing--------------------------------------->
 
  
{| cellspacing="0px" cellpadding="0" style="width:100%; background:white;"
+
<font face= "Elephant" size=3.2 color="#4D268F"> ''' UT1 DOCUMENTS REPOSITORY ''' </font><br/>
| style="width:100%; vertical-align:top; border:1px solid #EE8833; background:#FFF0E0;"|
+
{| class="wikitable"  
<div id="UserTesting" style="border-bottom:1px solid #EE8833; background:#FFC469; padding:0.2em 0.5em; font-size:130%; font-weight:bold;">
+
|-
User Testing</div>
+
! style="width:120pt; background:#fdff98;" | <center>DOCUMENT NAME</center> !! style="width:140pt; background:#fdff98;" | <center>DOCUMENT LINKS</center>
<div style="padding:0.4em 1em 1em;">
+
|-
 +
| style="background:#feffcb;" | '''<center>Scenario-Based Tasks</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_1_Scenario.docx‎|Click Here]]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 1 Feedback Form</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_1_FeedbackForm.docx‎‎|Click Here]]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 1 Results</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_Results_(1).docx‎‎|Click Here]]</center>'''
 +
|}
 +
|}
 +
<br>
  
You can find our Test Plan [http://www.google.com here]. <br/><br/>
+
<br/><font face= "Elephant" size=4.5 color="#2f2929"> ''' Usability Test 2 (14th February '13) ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #e9f8da"|
  
'''Here are our User Testing results:'''
+
<font face= "Elephant" size=3.2 color="#4D268F"> ''' GOALS ''' </font><br/>
*'''[http://www.google.com User Testing 1]''' (3rd to 6th January 2013)
+
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''1. Make sure all the new features implemented are workable and do not affect the old features from UT1'''<br><br>
 +
'''2. Obtain feedbacks from our users to improve the usability, experience and performance of the App'''
 +
|}
  
  
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TEST SCOPE ''' </font>
 
<imagemap>
 
<imagemap>
Image:Door1.jpg|250px|alt=Alt text
+
Image:Door1.png|320px|right|alt=Alt text
default [https://wiki.smu.edu.sg/is480/IS480_Team_wiki:_2012T2_Viaxeiros#UserTesting2 Welcome to User Testing 2]
+
default [https://wiki.smu.edu.sg/is480/IS480_Team_wiki:_2012T2_Viaxeiros_Application_Development/User_Testing_2 Welcome to User Testing 2]
 
desc none
 
desc none
 
</imagemap>
 
</imagemap>
 +
{| class="wikitable"
 +
|-
 +
! style="width:20pt; background:#ffee8b;" | <center>S/N</center> !! style="width:150pt; background:#ffee8b;" | <center>MAIN FUNCTION</center> !! style="width:320pt; background:#ffee8b;" | <center>FEATURES TESTED</center>
 +
|-
 +
| style="background:#feffcb;" | '''<center>1</center>'''|| style="background:#feffcb;" | '''<center>LOGIN</center>'''|| style="background:#feffcb;" | 
 +
*Facebook Login
 +
*Qiito Email Login
 +
|-
 +
| style="background:#fff2a4;" | '''<center>2</center>''' || style="background:#fff2a4;" | '''<center>DISCOVERY</center>'''|| style="background:#fff2a4;" | 
 +
*View Featured Travelogues
 +
*View Featured Places
 +
*View Featured Photos
 +
*<font color="#FF0000">'''View Online Google Map in Individual Travelogue'''</font>
 +
*<font color="#FF0000">'''View Online Google Map in Individual Place'''</font>
 +
|-
 +
| style="background:#feffcb;" | '''<center>3</center>''' || style="background:#feffcb;" | '''<center>MY TRAVELOGUE</center>'''|| style="background:#feffcb;" | 
 +
*<font color="#FF0000">'''Add all places to new Travelogue'''</font>
 +
*<font color="#FF0000">'''Add a place to existing Travelogue'''</font>
 +
*View My Travelogue Listing
 +
*View Individual Travelogue <font color="#FF0000">'''(with online map)'''</font>
 +
*View Individual Place in My Travelogue <font color="#FF0000">'''(with online map)'''</font>
 +
*Download My Travelogue
 +
*View Travelogue Offline (without map)
 +
*View Places in Travelogue Offline (without map)
 +
|-
 +
| style="background:#fff2a4;" | '''<center>4</center>''' || style="background:#fff2a4;" | '''<center>MY MEMORIES</center>'''|| style="background:#fff2a4;" | 
 +
*Capture Photos via Camera
 +
*<font color="#FF0000">'''Upload Photos via Camera/Gallery to Qiito's Server'''</font>
 +
|-
 +
| style="background:#feffcb;" | '''<center><font color="#FF0000">5</font></center>''' || style="background:#feffcb;" | '''<center><font color="#FF0000">MY PROFILE</font></center>'''|| style="background:#feffcb;" | 
 +
*<font color="#FF0000">'''View My Followers'''</font>
 +
|}
 +
<font color="#FF0000">'''*those in RED are newly added features'''</font>
 +
  
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TESTING METHODOLOGY ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''Our participants for UT2 consist of Existing and new Qiito App Users. For existing users, we asked our friends from UT1 to test on our App to see if our App has improved from UT1. We also target new users by inviting our fellow SMU friends from different schools to try out our App. '''<br><br>
 +
'''We conducted our Usability Testing 2 in a SR. Firstly, our team will brief them what our App is for. If the participants have Android phones, we will ask them to download our app from GooglePlay. If they have no Android phones, we will pass them our phones to test on. Like UT1, we gave our participants a sheet of instructions consisting a set of scenario-based tasks. We would then sit beside them and observe how they interact with our application. We should not guide them unless they are confused or don't know how to proceed. Our team would also note down the areas which are confusing.'''<br><br>
 +
'''After they have done with the tasks, we will then ask them to fill up an [https://docs.google.com/forms/d/1gB2qKNWdQu2tJ4zHeDXYnXwYWC5HlPQm7OlpaQ7ki_k/viewform Online Feedback Form]'''
 +
<imagemap>
 +
Image:UserTesting2.jpg|800px|center|alt=Alt text
 +
default [https://wiki.smu.edu.sg/is480/IS480_Team_wiki:_2012T2_Viaxeiros_Application_Development/User_Testing_2 Welcome to User Testing 2]
 +
desc none
 +
</imagemap> <br/>
 +
|}
  
<font face= "Elephant" size=6.5 color="#2f2929"> '''[[IS480_Team_wiki:_2012T2_Viaxeiros/UserTesting2| Find out more ]]''' </font><br/><br/>
+
 
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' UT2 DOCUMENTS REPOSITORY ''' </font><br/>
 +
{| class="wikitable"
 +
|-
 +
! style="width:120pt; background:#fdff98;" | <center>DOCUMENT NAME</center> !! style="width:140pt; background:#fdff98;" | <center>DOCUMENT LINKS</center>
 +
|-
 +
| style="background:#feffcb;" | '''<center>Scenario-Based Tasks</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_2_Scenario.docx‎|Click Here]]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 2 Feedback Form</center>'''|| style="background:#feffcb;" | '''<center>[https://docs.google.com/forms/d/1gB2qKNWdQu2tJ4zHeDXYnXwYWC5HlPQm7OlpaQ7ki_k/viewform Online Feedback Form]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 2 Results</center>'''|| style="background:#feffcb;" | '''<center>[[Media:UT2_Consolidated_Results.pptx‎|Click Here]]</center>'''
 +
|}
 +
|}
 +
<br>
 +
 
 +
<br/><font face= "Elephant" size=4.5 color="#2f2929"> ''' Usability Test 3 (1st April '13) ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #fff4fe"|
 +
 
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' GOALS ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''1. Make sure the enhancements we have made from UT 2 have improved the user experience of the App'''<br><br>
 +
'''2. To obtain feedbacks from our users and suggest them to Qiito for any future implementations of our App'''
 +
|}
 +
 
 +
 
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TEST SCOPE ''' </font>
 +
{| class="wikitable"
 +
|-
 +
! style="width:20pt; background:#ffee8b;" | <center>S/N</center> !! style="width:150pt; background:#ffee8b;" | <center>MAIN FUNCTION</center> !! style="width:320pt; background:#ffee8b;" | <center>FEATURES TESTED</center>
 +
|-
 +
| style="background:#feffcb;" | '''<center>1</center>'''|| style="background:#feffcb;" | '''<center>LOGIN</center>'''|| style="background:#feffcb;" | 
 +
*Facebook Login
 +
|-
 +
| style="background:#fff2a4;" | '''<center>2</center>''' || style="background:#fff2a4;" | '''<center>DISCOVERY</center>'''|| style="background:#fff2a4;" | 
 +
*View Featured Travelogues, Places, Photos
 +
*View Online Map of a Travelogue and Place
 +
*<font color="#FF0000">'''Search for a Place'''</font>
 +
*<font color="#FF0000">'''Filter content based on Country'''</font>
 +
|-
 +
| style="background:#feffcb;" | '''<center>3</center>''' || style="background:#feffcb;" | '''<center>MY TRAVELOGUE</center>'''|| style="background:#feffcb;" | 
 +
*Add place/places to Travelogue
 +
*View My Travelogue Listing
 +
*View Travelogue (with online map)
 +
*View a Place in My Travelogue (with online map)
 +
*Download My Travelogue
 +
*View Travelogue Offline <font color="#FF0000">'''(with offline map)'''</font>
 +
*View Places in Travelogue Offline <font color="#FF0000">'''(with offline map)'''</font>
 +
|-
 +
| style="background:#fff2a4;" | '''<center>4</center>''' || style="background:#fff2a4;" | '''<center>MY MEMORIES</center>'''|| style="background:#fff2a4;" | 
 +
*Capture Photos via Camera
 +
*Upload Photos via Camera/Gallery to Qiito
 +
|-
 +
| style="background:#feffcb;" | '''<center>5</center>''' || style="background:#feffcb;" | '''<center><font color="#FF0000">GUEST ACCOUNT</font></center>'''|| style="background:#feffcb;" | 
 +
*Browse Destinations
 +
*<font color="#FF0000">'''Add up to 10 places to Travelogue'''</font>
 +
*View Default Guest Travelogue
 +
*<font color="#FF0000">'''Other features, eg: Like, Share and Download travelogue for offline use will be directed to Login Page'''</font>
 +
*<font color="#FF0000">'''Upon logging in, any place(s) that was previously added in the Guest Default Travelogue, will be added to the Login user's Travelogue List'''</font>
 +
|}
 +
<font color="#FF0000">'''*those in RED are newly added features'''</font>
 +
 
 +
 
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' TESTING METHODOLOGY ''' </font><br/>
 +
{| cellpadding="9" style="border: 1px solid darkgray; text-align: center; height:50px"
 +
|scope="row"  width="1200" style="text-align: left; background: #FFF8C6"|
 +
'''Our participants for UT3 consist of Existing and new Qiito App Users. For existing users, we invited some of the previous UT2 users to test and see if the enhancement we have made to the App have improved their experience. We also invite our fellow SMU friends from different schools to try out our App. '''<br><br>
 +
'''We conducted our Usability Testing 3 in SOE SR 3-9. The procedures of our UT3 are similar to UT2. Our team first briefed our participants what our App is for. If the participants have Android phones, we would ask them to download our app from GooglePlay. If they have no Android phones, we will pass them our phones to test on. After which, they would be given a sheet of instructions consisting a set of unguided scenario-based tasks, in which participants have to figure out themselves how to plan a trip by making use of our App and to navigate around when they have reached their destination. During the UT, our team would sit beside them and observe how they interact with our application. We let the participants explore the application by themselves first. Only if they are confused or don't know how to proceed, we would then guide them and also note down the areas which are confusing to them.'''<br><br>
 +
'''After they have done with the tasks, we will then ask them to fill up an [https://docs.google.com/forms/d/14Fn5_bePk3x_kAL4S1sgx_-yLVH1xULoZxLwXm_Nq4w/viewform Online Feedback Form]'''
 +
<br/>
 +
[[Image:UT3.jpg|800px|center]] <br/>
 +
|}
 +
 
 +
 
 +
<font face= "Elephant" size=3.2 color="#4D268F"> ''' UT 3 DOCUMENTS REPOSITORY ''' </font><br/>
 +
{| class="wikitable"
 +
|-
 +
! style="width:120pt; background:#fdff98;" | <center>DOCUMENT NAME</center> !! style="width:140pt; background:#fdff98;" | <center>DOCUMENT LINKS</center>
 +
|-
 +
| style="background:#feffcb;" | '''<center>Scenario-Based Tasks</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_3_Scenario.docx‎|Click Here]]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 3 Feedback Form</center>'''|| style="background:#feffcb;" | '''<center>[https://docs.google.com/forms/d/14Fn5_bePk3x_kAL4S1sgx_-yLVH1xULoZxLwXm_Nq4w/viewform Online Feedback Form]</center>'''
 +
|-
 +
| style="background:#feffcb;" | '''<center>UT 3 Results</center>'''|| style="background:#feffcb;" | '''<center>[[Media:User_Testing_3_Results.pptx|Click Here]]</center>'''
 +
|}
 +
|} 
 +
|}
 +
<br>
  
 
</div>
 
</div>
 +
 +
|-
 +
| colspan="2" class="radius_bottom" style="background:#ffffff; border-top:8px solid #7cc1c7; border-bottom:0px; border-left:1px; border-right:1px"|
 
|}
 
|}
 +
  
 
<!------------------------------------Storyboard--------------------------------------->
 
<!------------------------------------Storyboard--------------------------------------->
  
{| cellspacing="0px" cellpadding="0" style="width:100%; background:white;"
+
<div id="StoryBoard" style="padding:0px; text-align: right; margin-bottom:0px;"  align="center"></div>
| style="width:100%; vertical-align:top; border:1px solid #EE8833; background:#FFF0E0;"|
+
{| cellpadding="1" cellspacing="1" style="width: 100%; background-color: #ffffff; vertical-align: top; "
<div id="StoryBoard" style="border-bottom:1px solid #EE8833; background:#FFC469; padding:0.2em 0.5em; font-size:130%; font-weight:bold;">
+
| colspan="2" style="padding: 0;" |
Storyboard</div>
+
|-
<div style="padding:0.4em 1em 1em;">
+
| style="width: 100%; vertical-align: top;"  align="center" |
 +
{| border="0" cellspacing="0" cellpadding="0" width="100%"
 +
| style="background-color:#ffffff;" width="0" |
 +
{| style="width="30%"; font-size:95%; text-align: justify;" padding:-2px; background:FFFFFF" cellpadding="0" cellspacing="0"
 +
| rowspan="1" width="30%" colspan="2" height="37px" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; padding:0; padding-right:1em; margin:0; -moz-border-radius-topright:1em" | <div style="margin-top: -20px; padding-left:3px"></div>
 +
 
 +
<div style="padding-left:10px; margin-top:36px; font-size:180%; font-family: Elephant;" >'''Storyboard'''</div>
 +
|}
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="8" | &nbsp;
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="100%"| &nbsp;
 +
|}
 +
{| style="width:100%; margin-bottom:.5em; font-size:95%; text-align: justify;" padding:-2px; background:#FFFFFF" cellpadding="0" cellspacing="0"  align="center"
 +
| rowspan="1" width="100%" colspan="2" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; border-top:0; padding:0; margin:0" |
  
 +
{| cellspacing="0px"  align="center" cellpadding="0" style="width:70%; background:#e4fcfe;vertical-align:top;"
 +
| style="width:100%; vertical-align:top; border:1px solid #e4fcfe; background:#e4fcfe;"|
 +
|}
 +
 +
<div style="padding: 1em 1em 1em 1em; " align="center">
 +
{| style="width:100%; border: 1px solid darkgray;"
 +
|-
 +
|
 +
<br/>
 
You can find our Storyboard here: [[Media:ViaxeirosStoryboard_v1.pdf|Version 1]]
 
You can find our Storyboard here: [[Media:ViaxeirosStoryboard_v1.pdf|Version 1]]
 +
 +
|}
  
 
</div>
 
</div>
 +
 +
|-
 +
| colspan="2" class="radius_bottom" style="background:#ffffff; border-top:8px solid #7cc1c7; border-bottom:0px; border-left:1px; border-right:1px"|
 
|}
 
|}
  
<!------------------------------------Technical Complexity--------------------------------------->
+
===<!------------------------------------Technical Complexity--------------------------------------->===
 +
 
 +
<div id="TechnologyComplexity" style="padding:0px; text-align: right; margin-bottom:0px;"  align="center"></div>
 +
{| cellpadding="1" cellspacing="1" style="width: 100%; background-color: #ffffff; vertical-align: top; "
 +
| colspan="2" style="padding: 0;" |
 +
|-
 +
| style="width: 100%; vertical-align: top;"  align="center" |
 +
{| border="0" cellspacing="0" cellpadding="0" width="100%"
 +
| style="background-color:#ffffff;" width="0" |
 +
{| style="width="30%"; font-size:95%; text-align: justify;" padding:-2px; background:FFFFFF" cellpadding="0" cellspacing="0"
 +
| rowspan="1" width="30%" colspan="2" height="37px" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; padding:0; padding-right:1em; margin:0; -moz-border-radius-topright:1em" |  <div style="margin-top: -20px; padding-left:3px"></div>
 +
 
 +
<div  style="padding-left:10px; margin-top:36px; font-size:180%; font-family: Elephant;" >'''Technical Complexity'''</div>
 +
|}
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="8" | &nbsp;
 +
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="100%"| &nbsp;
 +
|}
 +
{| style="width:100%; margin-bottom:.5em; font-size:95%; text-align: justify;" padding:-2px; background:#FFFFFF" cellpadding="0" cellspacing="0"  align="center"
 +
| rowspan="1" width="100%" colspan="2" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; border-top:0; padding:0; margin:0" |
  
{| cellspacing="0px" cellpadding="0" style="width:100%; background:white;"
+
{| cellspacing="0px"  align="center" cellpadding="0" style="width:70%; background:#e4fcfe;vertical-align:top;"
| style="width:100%; vertical-align:top; border:1px solid #EE8833; background:#FFF0E0;"|
+
| style="width:100%; vertical-align:top; border:1px solid #e4fcfe; background:#e4fcfe;"|
<div id="TechnologyComplexity" style="border-bottom:1px solid #EE8833; background:#FFC469; padding:0.2em 0.5em; font-size:130%; font-weight:bold;">
+
|}
Technical Complexity</div>
 
<div style="padding:0.4em 1em 1em;">
 
  
 +
<div style="padding: 1em 1em 1em 1em; " align="center">
 +
{| style="width:100%; border: 1px solid darkgray;"
 +
|-
 +
|
 +
<br/>
 
<b>1. ActionBarSherlock</b>
 
<b>1. ActionBarSherlock</b>
 
<br/><br/>
 
<br/><br/>
Line 118: Line 425:
 
Furthermore, older Android OS, which may not be able to support the newer OS, will not have the luxury to enjoy certain functionalities. Thus, extra time is needed to search for the best implementations without reducing usability of the application.
 
Furthermore, older Android OS, which may not be able to support the newer OS, will not have the luxury to enjoy certain functionalities. Thus, extra time is needed to search for the best implementations without reducing usability of the application.
 
<br/><br/>
 
<br/><br/>
<b>6. Offline Map Display (Pending)</b>
+
<b>6. Offline Map Display </b>
 
<br/><br/>
 
<br/><br/>
Whilst overseas, users may have difficulty obtaining data connectivity to have access to the full functionalities of Google Maps. With the implementation of OSMDroid (Open Street Map Droid), the application will cache a specific map area pertaining to the user’s itinerary. This allows users to view the touring area on the offline map, complete with zooming features and search function of that particular area. Being an open-sourced package increases the difficulty of implementation, due to lack of proper documentation to explore customized functions. There are also certain restriction of its usage due to it being free, thus algorithms for download are required to be stricter.
+
Whilst overseas, users may have difficulty obtaining data connectivity to have access to the full functionalities of Google Maps. With the implementation of Mapsforge, the application will download the maps data pertaining to the user’s itinerary. The map files (of .map file format) will then be used to render the map, thus allowing users to view the touring area on the offline map with full zooming features. This specificity is done through a customized algorithm to determine the right map files to be downloaded from the Qiito server.
<br/><br/>
+
 
<b>7. QBeam – Augmented Reality View (Pending)</b>
+
Being an open-sourced package increases the difficulty of implementation, due to lack of proper documentation and multiple versions available to explore customized functions. In particular, our team has faced many issues making use of the library itself and has to import and customize the library directly to suit our needs. We found that each versions support different functions; version 0.3.0 allows the manipulation of pins but does not support fragment while version 0.3.1 supports fragments but not pins manipulation. Hence, it is required for us to integrate both into the library for the full functionality we want in our offline map.  
<br/><br/>
+
 
Even as locals, users may be surprised to discover unknown places of interest around their town. This is where QBeam comes in to help with the discovery, by displaying places of interests surrounding the user’s current location. This will be viewed through the lens of the phone camera, complete with the direction and distance away from the user.
 
The team will be looking into exploring the Vuforia and Wikitude SDKs for Android in later iterations to deploy the Augmented Reality View function.
 
  
 +
|}
  
 
</div>
 
</div>
 +
 +
|-
 +
| colspan="2" class="radius_bottom" style="background:#ffffff; border-top:8px solid #7cc1c7; border-bottom:0px; border-left:1px; border-right:1px"|
 
|}
 
|}
  
 +
===<!------------------------------------Resources--------------------------------------->===
  
<!------------------------------------Resources--------------------------------------->
+
<div id="Resources" style="padding:0px; text-align: right; margin-bottom:0px;"  align="center"></div>
 +
{| cellpadding="1" cellspacing="1" style="width: 100%; background-color: #ffffff; vertical-align: top; "
 +
| colspan="2" style="padding: 0;" |
 +
|-
 +
| style="width: 100%; vertical-align: top;"  align="center" |
 +
{| border="0" cellspacing="0" cellpadding="0" width="100%"
 +
| style="background-color:#ffffff;" width="0" |
 +
{| style="width="30%"; font-size:95%; text-align: justify;" padding:-2px; background:FFFFFF" cellpadding="0" cellspacing="0"
 +
| rowspan="1" width="30%" colspan="2" height="37px" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; padding:0; padding-right:1em; margin:0; -moz-border-radius-topright:1em" |  <div style="margin-top: -20px; padding-left:3px"></div>
  
{| cellspacing="0px" cellpadding="0" style="width:100%; background:white;"
+
<div  style="padding-left:10px; margin-top:36px; font-size:180%; font-family: Elephant;" >'''Resources'''</div>
| style="width:100%; vertical-align:top; border:1px solid #EE8833; background:#FFF0E0;"|
+
|}
<div id="Resources" style="border-bottom:1px solid #EE8833; background:#FFC469; padding:0.2em 0.5em; font-size:130%; font-weight:bold;">
+
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="8" | &nbsp;
Resources</div>
+
| style="border-bottom:8px solid #7cc1c7; background:#ffffff;" width="100%"| &nbsp;
<div style="padding:0.4em 1em 1em;">
+
|}
 +
{| style="width:100%; margin-bottom:.5em; font-size:95%; text-align: justify;" padding:-2px; background:#FFFFFF" cellpadding="0" cellspacing="0"  align="center"
 +
| rowspan="1" width="100%" colspan="2" valign="top" style="background:#e4fcfe; border:8px solid #7cc1c7; border-bottom:0; border-top:0; padding:0; margin:0" |
 +
 
 +
{| cellspacing="0px"  align="center" cellpadding="0" style="width:70%; background:#e4fcfe;vertical-align:top;"
 +
| style="width:100%; vertical-align:top; border:1px solid #e4fcfe; background:#e4fcfe;"|
 +
|}
 +
 
 +
<div style="padding: 1em 1em 1em 1em; " align="center">
 +
{| style="width:100%; border: 1px solid darkgray;"
 +
|-
 +
|
 
Below are the tools are resources our team is currently employing during this project:<br><br>
 
Below are the tools are resources our team is currently employing during this project:<br><br>
 
<center>
 
<center>
Line 157: Line 486:
 
| Library that provides multiple interfaces within an Activity.
 
| Library that provides multiple interfaces within an Activity.
 
|-
 
|-
| [[http://code.google.com/p/osmdroid/ OSMDroid]]
+
| [[https://code.google.com/p/mapsforge/ Mapsforge]]
 
| Map library we are exploring and deploying for our offline map viewing functionality.
 
| Map library we are exploring and deploying for our offline map viewing functionality.
 
|}
 
|}
</center>
+
</center><br>
 +
|}
  
 
</div>
 
</div>
 +
 +
|-
 +
| colspan="2" class="radius_bottom" style="background:#ffffff; border-top:8px solid #7cc1c7; border-bottom:0px; border-left:1px; border-right:1px"|
 
|}
 
|}

Latest revision as of 03:04, 22 April 2013

Viaxerios Logov1.png
Welcome to Viaxeiros FYP Wiki Page
Navigation 3.png


User Requirements Analysis
   


Survey 1

You can find the questions to our survey here
A summary review of the survey could be found here
Summary findings (Charts) could be found here


Feedback (Google Deployment)

Watch out for this space


Usability Tests
   


Usability Test 1 (3rd - 6th January '13)

GOALS

1. Make sure all the new features are workable and ready for Deployment 1

2. Obtain feedback to improve the usability and performance of the App


TEST SCOPE

S/N
MAIN FUNCTION
FEATURES TESTED
1
LOGIN
  • Facebook Login
  • Qiito Email Login
2
DISCOVERY
  • View Featured Travelogues
  • View Featured Places
  • View Featured Photos
3
TRAVELOGUE
  • View My Travelogue Listing
  • View Individual Travelogue
  • View Individual Place in My Travelogue
  • Download My Travelogue
  • View Travelogue Offline (without map)
  • View Places in Travelogue Offline (without map)
4
MEMORIES
  • Capture Photos via Camera
  • Select a Photo via Gallery


TESTING METHODOLOGY

Our participants for UT1 are mainly our close friends. Each of us would get a friend to conduct User Testing with.

Firstly, our team will brief them what our App is for. As our App has not been deployed yet, we will pass them our phone and a sheet of instructions consisting a set of scenario-based tasks. We would then sit beside them and observe how they interact with our application. We should not guide them unless they are confused or unsure how to proceed.

After they are done with the tasks, we will then give them a feedback form for them to fill up.


UT1 DOCUMENTS REPOSITORY

DOCUMENT NAME
DOCUMENT LINKS
Scenario-Based Tasks
Click Here
UT 1 Feedback Form
Click Here
UT 1 Results
Click Here



Usability Test 2 (14th February '13)

GOALS

1. Make sure all the new features implemented are workable and do not affect the old features from UT1

2. Obtain feedbacks from our users to improve the usability, experience and performance of the App


TEST SCOPE

Alt text
S/N
MAIN FUNCTION
FEATURES TESTED
1
LOGIN
  • Facebook Login
  • Qiito Email Login
2
DISCOVERY
  • View Featured Travelogues
  • View Featured Places
  • View Featured Photos
  • View Online Google Map in Individual Travelogue
  • View Online Google Map in Individual Place
3
MY TRAVELOGUE
  • Add all places to new Travelogue
  • Add a place to existing Travelogue
  • View My Travelogue Listing
  • View Individual Travelogue (with online map)
  • View Individual Place in My Travelogue (with online map)
  • Download My Travelogue
  • View Travelogue Offline (without map)
  • View Places in Travelogue Offline (without map)
4
MY MEMORIES
  • Capture Photos via Camera
  • Upload Photos via Camera/Gallery to Qiito's Server
5
MY PROFILE
  • View My Followers

*those in RED are newly added features


TESTING METHODOLOGY

Our participants for UT2 consist of Existing and new Qiito App Users. For existing users, we asked our friends from UT1 to test on our App to see if our App has improved from UT1. We also target new users by inviting our fellow SMU friends from different schools to try out our App.

We conducted our Usability Testing 2 in a SR. Firstly, our team will brief them what our App is for. If the participants have Android phones, we will ask them to download our app from GooglePlay. If they have no Android phones, we will pass them our phones to test on. Like UT1, we gave our participants a sheet of instructions consisting a set of scenario-based tasks. We would then sit beside them and observe how they interact with our application. We should not guide them unless they are confused or don't know how to proceed. Our team would also note down the areas which are confusing.

After they have done with the tasks, we will then ask them to fill up an Online Feedback Form

Alt text


UT2 DOCUMENTS REPOSITORY

DOCUMENT NAME
DOCUMENT LINKS
Scenario-Based Tasks
Click Here
UT 2 Feedback Form
Online Feedback Form
UT 2 Results
Click Here



Usability Test 3 (1st April '13)

GOALS

1. Make sure the enhancements we have made from UT 2 have improved the user experience of the App

2. To obtain feedbacks from our users and suggest them to Qiito for any future implementations of our App


TEST SCOPE

S/N
MAIN FUNCTION
FEATURES TESTED
1
LOGIN
  • Facebook Login
2
DISCOVERY
  • View Featured Travelogues, Places, Photos
  • View Online Map of a Travelogue and Place
  • Search for a Place
  • Filter content based on Country
3
MY TRAVELOGUE
  • Add place/places to Travelogue
  • View My Travelogue Listing
  • View Travelogue (with online map)
  • View a Place in My Travelogue (with online map)
  • Download My Travelogue
  • View Travelogue Offline (with offline map)
  • View Places in Travelogue Offline (with offline map)
4
MY MEMORIES
  • Capture Photos via Camera
  • Upload Photos via Camera/Gallery to Qiito
5
GUEST ACCOUNT
  • Browse Destinations
  • Add up to 10 places to Travelogue
  • View Default Guest Travelogue
  • Other features, eg: Like, Share and Download travelogue for offline use will be directed to Login Page
  • Upon logging in, any place(s) that was previously added in the Guest Default Travelogue, will be added to the Login user's Travelogue List

*those in RED are newly added features


TESTING METHODOLOGY

Our participants for UT3 consist of Existing and new Qiito App Users. For existing users, we invited some of the previous UT2 users to test and see if the enhancement we have made to the App have improved their experience. We also invite our fellow SMU friends from different schools to try out our App.

We conducted our Usability Testing 3 in SOE SR 3-9. The procedures of our UT3 are similar to UT2. Our team first briefed our participants what our App is for. If the participants have Android phones, we would ask them to download our app from GooglePlay. If they have no Android phones, we will pass them our phones to test on. After which, they would be given a sheet of instructions consisting a set of unguided scenario-based tasks, in which participants have to figure out themselves how to plan a trip by making use of our App and to navigate around when they have reached their destination. During the UT, our team would sit beside them and observe how they interact with our application. We let the participants explore the application by themselves first. Only if they are confused or don't know how to proceed, we would then guide them and also note down the areas which are confusing to them.

After they have done with the tasks, we will then ask them to fill up an Online Feedback Form

UT3.jpg


UT 3 DOCUMENTS REPOSITORY

DOCUMENT NAME
DOCUMENT LINKS
Scenario-Based Tasks
Click Here
UT 3 Feedback Form
Online Feedback Form
UT 3 Results
Click Here



Storyboard
   


You can find our Storyboard here: Version 1

Technical Complexity
   


1. ActionBarSherlock

An Action Bar is a bar at the top of the screen which is used across the application to identify the application brand and to support navigation. As Action Bar is not available for pre-honeycomb Android devices, we decided to make use of the ActionBarSherlock library, an open-sourced library designed to facilitate the implementation of Action Bar natively across all versions of Android devices using a single API. This library also provides additional features such as Fragments which is currently not present in the standard ActionBar mode.

2. Fragments

To integrate with the Sherlock Action Bar used as a header bar, fragments are used to allow multiple interfaces within a single activity. This allows a better manipulation of functions when users navigate through the application. For example, the navigation between a web view and a native view with differing interface will only require two different fragments, instead of creating a new activity. In addition, due to the flexibility of fragments, each of them can be recycled and used in other activities within the application, reducing the need for repeated codes.

3. Image Loading

To speed up the display of pages and improve user experience, we have made use of “lazy loading” to enable the display of native pages (template) first while images are downloaded and displayed on the pages as and when they are ready. We have been able to do so with the use of the “Asynchronous” feature available in Android development.

4. URL Tracking

The android application that we are building for Qiito is a mixture of Qiito’s current mobile web and pure native pages. Some of the native pages include travelogue listing, travelogues and places. To enable switching between mobile web and native pages, there is a need to monitor the changes in URL. Should a following URL point to a webpage that requires native display, example travelogue listing, travelogues or places, there will be a need to call the native codes for display. Else, the mobile web should be called instead.

5. Different phone models with different OS versions

Since the Android software is offered on many different phone models, our team needs to cater for different image sizes to these phones. This is because phones tend to vary in size, features and user experience. Thus, this further complicates the native design process as additional time is required in resizing images and there is difficulty in ensuring consistency of the application for the rest of the other models. Additional testing is required as different sizes of phone models are tested to ensure that the images are displayed correctly.
Furthermore, older Android OS, which may not be able to support the newer OS, will not have the luxury to enjoy certain functionalities. Thus, extra time is needed to search for the best implementations without reducing usability of the application.

6. Offline Map Display

Whilst overseas, users may have difficulty obtaining data connectivity to have access to the full functionalities of Google Maps. With the implementation of Mapsforge, the application will download the maps data pertaining to the user’s itinerary. The map files (of .map file format) will then be used to render the map, thus allowing users to view the touring area on the offline map with full zooming features. This specificity is done through a customized algorithm to determine the right map files to be downloaded from the Qiito server.

Being an open-sourced package increases the difficulty of implementation, due to lack of proper documentation and multiple versions available to explore customized functions. In particular, our team has faced many issues making use of the library itself and has to import and customize the library directly to suit our needs. We found that each versions support different functions; version 0.3.0 allows the manipulation of pins but does not support fragment while version 0.3.1 supports fragments but not pins manipulation. Hence, it is required for us to integrate both into the library for the full functionality we want in our offline map.


Resources
   

Below are the tools are resources our team is currently employing during this project:

[Eclipse IDE For Mobile Developers] Our trusty IDE that provides our coding environment!
[Subclipse] Subclipse is an Eclipse Team Provider plug-in providing support for Subversion within the Eclipse IDE.
[Android SDK Package] Providing the API libraries and developer tools necessary to build, test, and debug apps for our application.
[ActionBarSherlock] This library supports the use of ActionBar across all versions of Android using a single API.
[Fragments] Library that provides multiple interfaces within an Activity.
[Mapsforge] Map library we are exploring and deploying for our offline map viewing functionality.