Prototype user journey

[robertocarroll]

1. User visits Amnesty site

• App is embedded via responsive iframe. At the moment it is here: https://wearethoughtfox.github.io/amnesty-facebook/app/
• Translation via variable in url e.g. ?lang=es

Considerations

• What if Facebook doesn't load
• What if the user has no internet connection
• What if the URL lang parameter contains an unsupported language, like ?lang=hu (Hungarian)
• What if the URL lang parameter contains a value that isn’t a language, like ?lang=notalanguage

2. App successfully connects to Facebook API. Shows nominate button

3. Nominate button opens log in dialogue

• User must log in
• User must give permissions

Considerations

• How does this work on mobile?
• What if log in fails - handle error / try again

4. Getting location from Facebook

Considerations

• Location is home town. How to associate this with the correct action to load in the customised regional iFrame?

5. User can see friends list

• Next / previous controls to page through list
• No way to control the sort order in the API

Considerations

• Show / hide of next / previous so the UI elements don't jump around
• If the next/previous buttons can sometimes be visible when there is no next/previous page, we need to handle the error that’s thrown when the user clicks on them in this state.
• Manage scroll state during paging? If I am at the bottom of the list and click next presumably I want to be a the top of the next page not the bottom

6. User can select a friend

• User can write in the text box
• Selected friend is shown below text box
  

Considerations

• Handle inputs: blank, etc.

7. User clicks submit and posts message to Facebook

• Message has fixed intro text to frame the message

Considerations

• Need some thinking on the best layout to frame this message
• Handle errors on posting to Facebook. If fail, tell user and allow posting again

8. Success

• User is informed that they have successfully nominated the person

9. Invite your friend to group

• Uses "send dialogue" to open a Facebook private message window with a link

Considerations

• Can customise this link in the dictionary file
• This is the only way to send a private message (I think).
• Don't seem to be able to pre-populate the form with the selected user
• Doesn't work on mobile

10. Tell your friends

• User can share the link to the app

Considerations

• This is Facebook functionality - need to check on mobile
• Link can be anything
• Title, description and image come from link metadata. No control over these inside the app

11. Nominate another person

• returns the user to screen 5 to repeat the process

[robertocarroll]

Reviewed.