HeaderSIS.jpg

Difference between revisions of "IS480 Team wiki: 2012T2 Succinq Project Overview Humaneity Mobile"

From IS480
Jump to navigation Jump to search
 
(25 intermediate revisions by 2 users not shown)
Line 61: Line 61:
 
| width="180pt" | [[Image:ios_1.png|180 px]]
 
| width="180pt" | [[Image:ios_1.png|180 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.42.35 PM.png|200 px]]
+
| width="200pt" | [[Image:IOS_MainScreen.PNG|200 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.42.52 PM.png|200 px]]
+
| width="200pt" | [[Image:IOS_MainMenu.PNG|200 px]]
 
|-
 
|-
  
Line 86: Line 86:
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.43.36 PM.png|200 px]]
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.43.36 PM.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.44.06 PM.png|200 px]]
+
| width="200pt" | [[Image:View_story_comment.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.45.10 PM.png|200 px]]
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.45.10 PM.png|200 px]]
Line 145: Line 145:
 
|-
 
|-
  
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.47.11 PM.png|200 px]]
+
| width="200pt" | [[Image:IOS_QuotesView.PNG|200 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.48.05 PM.png|200 px]]
+
| width="200pt" | [[Image:Select_prompt.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.49.11 PM.png|200 px]]
+
| width="200pt" | [[Image:IOS_QuotesCommentsView.PNG|200 px]]
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.49.40 PM.png|200 px]]
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.49.40 PM.png|200 px]]
Line 171: Line 171:
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:Photo 23-2-13 9 03 29 PM.png|200 px]]
 
| width="200pt" | [[Image:Photo 23-2-13 9 03 29 PM.png|200 px]]
 +
|-
 +
 +
|}
 +
<br>
 +
{|
 +
|align ="center"| '''Flag a Quote comment'''
 +
|
 +
|align ="center"| '''Flag Quote'''
 +
|
 +
|align ="center"| '''Quote Flagged'''
 +
|-
 +
 +
| width="200pt" | [[Image:IOS_QuotesCommentFlag.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_QuotesFlagConfirm.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_QuotesFlagged.PNG|200 px]]
 
|-
 
|-
  
Line 185: Line 202:
 
|-
 
|-
  
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.50.14 PM.png|200 px]]
+
| width="200pt" | [[Image:IOS_GivesBackView.PNG|200 px]]
 
| width="50pt" |
 
| width="50pt" |
| width="200pt" | [[Image:Photo 23-2-13 8 10 03 PM.png|200 px]]
+
| width="200pt" | [[Image:View_project_details.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:Photo 23-2-13 8 20 18 PM.png|200 px]]
 
| width="200pt" | [[Image:Photo 23-2-13 8 20 18 PM.png|200 px]]
Line 216: Line 233:
 
<br>
 
<br>
 
{|
 
{|
|align ="center"| '''Donate for a Project'''  
+
|align ="center"| '''Select Donate method for a Project'''  
 
|
 
|
 +
|align ="center"| '''Select Donate amount for a Project'''
 +
|-
 +
 +
| width="200pt" | [[Image:IOS_GivesBack_Donate1.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_GivesBackAmmado.PNG|200 px]]
 +
|-
 +
 +
|}
 +
<br>
 +
{|
 
|align ="center"| '''PayPal Login'''  
 
|align ="center"| '''PayPal Login'''  
 
|
 
|
Line 223: Line 251:
 
|
 
|
 
|align ="center"| '''Input Payment Details'''  
 
|align ="center"| '''Input Payment Details'''  
 +
|
 +
|align ="center"| '''Ammado Transaction Browser'''
 
|-
 
|-
  
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.52.03 PM.png|200 px]]
 
| width="50pt" |
 
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.52.40 PM.png|200 px]]
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.52.40 PM.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
Line 232: Line 260:
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.53.07 PM.png|200 px]]
 
| width="200pt" | [[Image:Screen Shot 2013-02-23 at 2.53.07 PM.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_GivesBackAmmado2.PNG|200 px]]
 +
|-
 +
 +
|}
 +
<br><br>
 +
*<span style="font-size:150%">'''Travel'''</span>
 +
<br>
 +
{|
 +
|align ="center"| '''Travel Main Tab'''
 +
|
 +
|align ="center"| '''View Travel details'''
 +
|
 +
|align ="center"| '''Apply for Travel'''
 +
|-
 +
 +
| width="200pt" | [[Image:IOS_TravelView.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_TravelView2.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Photo_18-4-13_8_23_08_PM.png|200 px]]
 +
|-
 +
 +
|}
 +
<br><br>
 +
*<span style="font-size:150%">'''Voices'''</span>
 +
<br>
 +
{|
 +
|align ="center"| '''Voices Main Tab'''
 +
|
 +
|align ="center"| '''Sign a petition for a discussion topic'''
 +
|-
 +
 +
 +
| width="200pt" | [[Image:IOS_VoicesMain.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_VoicesJoinPetition.PNG|200 px]]
 +
|-
 +
 +
|}
 +
<br>
 +
{|
 +
|align ="center"| '''Submit a video responese'''
 +
|
 +
|align ="center"| '''View responses'''
 +
|
 +
|align ="center"| '''Share a discussion topic via Facebook'''
 +
|-
 +
 +
 +
| width="200pt" | [[Image:IOS_VoicesRespond1.PNG|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:View_video_response.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:IOS_VoicesShare.PNG|200 px]]
 
|-
 
|-
  
Line 358: Line 441:
 
|-
 
|-
  
| width="200pt" | [[Image:2013-02-23 21.57.13.png|200 px]]
+
| width="200pt" | [[Image:Quotes_create_text.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:2013-02-23 22.14.48.png|200 px]]
 
| width="200pt" | [[Image:2013-02-23 22.14.48.png|200 px]]
Line 370: Line 453:
 
<br>
 
<br>
 
{|
 
{|
 +
|align ="center"| '''Flag a Quote comment'''
 +
|
 
|align ="center"| '''Flag Quote'''  
 
|align ="center"| '''Flag Quote'''  
 
|
 
|
Line 375: Line 460:
 
|-
 
|-
  
 +
| width="200pt" | [[Image:Quotes_comments_flagged.png|200 px]]
 +
| width="50pt" |
 
| width="200pt" | [[Image:Quotes_flag.png|200 px]]
 
| width="200pt" | [[Image:Quotes_flag.png|200 px]]
 
| width="50pt" |
 
| width="50pt" |
Line 443: Line 530:
 
|
 
|
 
|align ="center"| '''Payment Success'''  
 
|align ="center"| '''Payment Success'''  
 +
|
 +
|align ="center"| '''(Ammado) Transaction Browser'''
 
|-
 
|-
  
Line 452: Line 541:
 
| width="50pt" |
 
| width="50pt" |
 
| width="200pt" | [[Image:2013-02-23 21.48.40.png|200 px]]
 
| width="200pt" | [[Image:2013-02-23 21.48.40.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Gives_donate_ammado.png|200 px]]
 +
|-
 +
 +
 +
|}
 +
<br>
 +
*<span style="font-size:150%">'''Travel'''</span>
 +
<br>
 +
{|
 +
|align ="center"| '''Travel Main Tab'''
 +
|
 +
|align ="center"| '''Travel Details'''
 +
|
 +
|align ="center"| '''Sign up for Travel'''
 +
|
 +
|align ="center"| '''Share Via Facebook'''
 +
|-
 +
 +
| width="200pt" | [[Image:Travel_final.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Travel_detail.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Travel_participate.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Travel_share.png|200 px]]
 +
|-
 +
 +
|}
 +
<br>
 +
*<span style="font-size:150%">'''Voices'''</span>
 +
<br>
 +
{|
 +
|align ="center"| '''Voices Main Tab'''
 +
|
 +
|align ="center"| '''Discussion topic Details'''
 +
|
 +
|align ="center"| '''Sign a petition for a discussion topic''' 
 +
|-
 +
 +
| width="200pt" | [[Image:Voices.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Voices_detail.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Voices_sign.png|200 px]]
 +
|-
 +
 +
|}
 +
<br>
 +
{|
 +
|align ="center"| '''Submit a video response'''
 +
|
 +
|align ="center"| '''View responses'''
 +
|
 +
|align ="center"| '''Share a discussion topic via Facebook''' 
 +
|-
 +
 +
| width="200pt" | [[Image:Voices_video_response.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Voices_responses.png|200 px]]
 +
| width="50pt" |
 +
| width="200pt" | [[Image:Voices_share.png|200 px]]
 
|-
 
|-
  

Latest revision as of 11:59, 19 April 2013

Succinq team banner.png

HOME

 

THE COLLABORATION

 

PROJECT OVERVIEW

 

PROJECT MANAGEMENT

 

PROJECT DOCUMENTATION

 


{ Project Description } { Humaneity Mobile } { Admin Portal } { Project X Factor }


- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Humaneity Mobile Screenshots

iOS User Interface Storyboard

  • Splashscreen and Home Page


Splashscreen Home Page Menu Button
Ios 1.png IOS MainScreen.PNG IOS MainMenu.PNG



  • Stories


Stories Main Tab View a Story View a Story's comments Make a comment Share via Facebook
Screen Shot 2013-02-23 at 2.43.22 PM.png Screen Shot 2013-02-23 at 2.43.36 PM.png View story comment.png Screen Shot 2013-02-23 at 2.45.10 PM.png Photo 23-2-13 8 21 16 PM.png



  • Videos


Videos Main Tab Refresh Video List Choose and Watch a Video Share via Facebook
Photo 23-2-13 7 25 46 PM.png Photo 23-2-13 7 26 10 PM.png Photo 23-2-13 7 26 36 PM.png Photo 23-2-13 8 20 54 PM.png


Portrait View Landscape View
Photo 23-2-13 7 26 45 PM.png Photo 23-2-13 7 26 59 PM.png



  • Quotes


Quotes Main Tab Submit a Quote from own image gallery/Submit an image using the camera function View a Quote's comments Make a comment Share via Facebook
IOS QuotesView.PNG Select prompt.png IOS QuotesCommentsView.PNG Screen Shot 2013-02-23 at 2.49.40 PM.png Photo 23-2-13 8 20 42 PM.png


Input Caption for Quote Validation Submit Quote
Photo 23-2-13 9 03 23 PM.png Photo 23-2-13 9 02 59 PM.png Photo 23-2-13 9 03 29 PM.png


Flag a Quote comment Flag Quote Quote Flagged
IOS QuotesCommentFlag.PNG IOS QuotesFlagConfirm.PNG IOS QuotesFlagged.PNG



  • Gives Back


Gives Back Main Tab View a Project Share via Facebook
IOS GivesBackView.PNG View project details.png Photo 23-2-13 8 20 18 PM.png


Volunteer for a Project Validations for Empty Fields Input Details Submit Details
Screen Shot 2013-02-23 at 2.50.32 PM.png Screen Shot 2013-02-23 at 2.50.45 PM.png Screen Shot 2013-02-23 at 2.51.32 PM.png Screen Shot 2013-02-23 at 2.51.46 PM.png


Select Donate method for a Project Select Donate amount for a Project
IOS GivesBack Donate1.PNG IOS GivesBackAmmado.PNG


PayPal Login Choice of Payment Input Payment Details Ammado Transaction Browser
Screen Shot 2013-02-23 at 2.52.40 PM.png Screen Shot 2013-02-23 at 2.52.15 PM.png Screen Shot 2013-02-23 at 2.53.07 PM.png IOS GivesBackAmmado2.PNG



  • Travel


Travel Main Tab View Travel details Apply for Travel
IOS TravelView.PNG IOS TravelView2.PNG Photo 18-4-13 8 23 08 PM.png



  • Voices


Voices Main Tab Sign a petition for a discussion topic
IOS VoicesMain.PNG IOS VoicesJoinPetition.PNG


Submit a video responese View responses Share a discussion topic via Facebook
IOS VoicesRespond1.PNG View video response.png IOS VoicesShare.PNG



Android User Interface Storyboard

  • Splashscreen and Home Page


Splashscreen Home Page Menu Button About Humaneity Feedback form
Humaneity splash.png Home final.png Home menu.png Home about.png Home feedback.png



  • Stories


Stories Main Tab View a Story View a Story's comments Make a comment Share via Facebook
Stories.png Stories detail.png Stories comments.png Stories leave comment.png 2013-02-23 21.29.53.png



  • Videos


Videos Main Tab Share via Facebook
Videos.png 2013-02-23 21.33.06.png


Portrait View Landscape View
2013-02-23 21.32.02.png 2013-02-23 21.34.22.png



  • Quotes


Quotes Main Tab Submit a Quote from own image gallery/Submit an image using the camera function View a Quote's comments Make a comment Share via Facebook
Quotes final.png Quotes create.png Quotes comments.png 2013-02-23 21.37.42.png 2013-02-23 21.52.42.png


Input Caption for Quote Validation Preview Submit Quote
Quotes create text.png 2013-02-23 22.14.48.png Quotes preview.png 2013-02-23 21.58.35.png


Flag a Quote comment Flag Quote Quote Flagged
Quotes comments flagged.png Quotes flag.png Quotes flagged.png



  • Gives Back


Gives Back Main Tab View a Project Share via Facebook
Gives.png Gives detail.png Gives share.png


Volunteer for a Project Validations for Empty Fields Input Details Submit Details
Gives volunteer.png 2013-02-23 21.42.55.png 2013-02-23 21.45.14.png 2013-02-23 21.46.06.png


Select a fixed amount to donate Choose donation method
Gives donate amount.png Gives donate method.png


(PayPal)Warning Pop-up PayPal Login Input Payment Details Payment Success (Ammado) Transaction Browser
2013-02-23 22.01.53.png 2013-02-23 21.47.42.png 2013-02-23 21.48.14.png 2013-02-23 21.48.40.png Gives donate ammado.png


  • Travel


Travel Main Tab Travel Details Sign up for Travel Share Via Facebook
Travel final.png Travel detail.png Travel participate.png Travel share.png


  • Voices


Voices Main Tab Discussion topic Details Sign a petition for a discussion topic
Voices.png Voices detail.png Voices sign.png


Submit a video response View responses Share a discussion topic via Facebook
Voices video response.png Voices responses.png Voices share.png



Humaneity Mobile Mockup

iOS User Interface of App Mockup

  • Main Page View
Main page.png
This is the first page that the user will see when he launches the mobile application. He will be able to see the Story of the Day, Video of the Day and Travel opportunities. The different images will bring the user to a more detailed view respectively.



  • Stories View
Stories Main.png Stories View iOS.png
The user selects the Stories tab, user can scroll left or right to view more stories. If he is interested in a particular story, he tap in to read the full article. When he is in a particular story, he will be able to read the full article, view the article's comments, comment on the article and also share the article via Facebook.



  • Videos View
Videos Main.png Videos View iOS.png
The user selects the Videos tab, user can scroll up or down to view more videos. If he is interested in a particular video, he can watch it by tapping on the video's row. While in the video view, he can also choose to share the video via Facebook.



  • Quotes View
Quotes Main.png
The user selects the Quotes tab, user can scroll left or right to view more quotes. If he is interested in a particular quote, he can choose to comment on it, view the quote's comments or share it via Facebook. If the user wants to submit a quote of his own either by taking a picture with his camera or from his gallery. This can be done by clicking the camera button.



  • Gives Back View
Give Back Main.png Give Back View.png
The user selects the Give Back tab, and user can scroll left or right to view more projects. If he is interested to read more about the project, he can tab anywhere below the 3 buttons for more details. Then he can donate a fix amount to support the project, or volunteer by tapping on the volunteer to input his details to be sent to Humaneity.



  • Travel View
Travel.png TravelDescription1.png TravelDescription2.png
Having accessed the travel view, you will see a list of all the available travel opportunities. Selecting any one of them would bring you to the detailed view of the trip. Details include the Trip Name, Cost, Date and Description. You can either scroll down or click the volunteer button to access the 3 textfields where your input will be taken so that your details will be captured for the trip.


Android User Interface of App Mockup

  • Articles View

Stories View.png

After opening the Humaneity mobile application, the user would like to read article by clicking "STORIES" shown on navigation bar or the picture of "Cover Story". This First Article would be displayed with picture, headline and Summary of the Article. Upon deciding that the user wants to read more about this article, he would click the picture of headline to access the full length of the article.


  • Videos View

Videos View.png

After opening the Humaneity mobile application, the user would like to watch a video by clicking "VIDEOS" shown on navigation bar or the picture of "Video". A list of videos with its Title and description will be shown. Having selected the video user wants to watch, the mobile application will open the phone's video player in which user can then enjoy the video.


  • Quotes View

Quotes.png

After opening the Humaneity mobile application, the user would like to access the Quotes feature of the application by clicking "QUOTES" on the navigation bar. Users may decide to share a Quote that he finds meaningful to share via Facebook or submit a quote to share with the application community. By clicking "SUBMIT", user can choose an image either by taking a picture or from its phone gallery to accompany the submission of the Quote.


  • Travel View

Travel View.png

Being interested in the going on an overseas community project, the user can access a list of available projects by clicking "TRAVEL" on the navigation bar. By clicking on any of the projects, the user will be shown in much greater detail, information regarding the overseas community project. At this screen, the user may also apply for the project if he wants by clicking on the Apply for travel now button. From here, the user can fill in his details and click on the Apply button.


  • Donate View

Donate View.png

While the user is in the application, a pop up would occur and show interesting and jaw-dropping details about a certain cause. From here, the user may either read an article regarding the cause or donate to it. If the user decides to donate, the application would allow the user to select donation amount and process the donation via Paypal.


  • Vote for cause

Vote for cause.png

While the user is in the application, the user can choose to vote for a cause among a list of projects by clicking the thumbs up icon. From here, the user can read more about the various causes by clicking on various images. If the user decides to vote, the user can click the vote button and their vote would be registered.


Please refer to our use case diagrams and descriptions for a full list of application functions.