Challenge Summary
Welcome to the FCBH Bible.Is Facebook App Wireframe Challenge. In this challenge, we are looking to start afresh with the design for a Facebook app that facilitates Bible listening and engagement, spanning multiple languages. The idea is to make Bible content accessible via multilingual audio, as well as encourage and provide a platform for discussion - while utilizing the capabilities of Facebook as a platform.
Round 1
Please submit your initial wireframe for checkpoint review. This should include at least the following screens:
1) Landing Page
2) Interactive Player
3) Video Chat
Round 2
Please submit your final wireframe design, after incorporating checkpoint feedback. This should include all screens and features mentioned in the spec.
Challenge Details:
The goal of this challenge is to recreate a Facebook app for Bible listening and engagement. Facebook is introducing free internet across multiple countries (including Zambia, Colombia, etc) so by building this app entirely via the FB framework, users will be able to access all the Bible content and interact with other users for free. We are looking to have the wireframes designed for a new Bible.Is app - that incorporates features that lead to a simpler and engaging user experience, facilitate discussions, and include gamification, etc.
Wireframe Expectations:
- Produce HTML click through wireframes that can be used to demonstrate all mentioned functionalities as required in each round.
- Keep in mind that the entire app experience needs to stay within Facebook, no external links or outside content - since we are targeting users with free access to Facebook
- Since the majority of users of this app may be using it in languages other than English, try to make sure the user experience is more intuitive - using more symbols and familiar actions, and not too text-heavy, so as to be easily understood across language barriers.
- Content should be structured so as to be responsive and easily adaptable to mobile.
- The Facebook app must be very easy to use and intuitive, and must make maximum use of the features/user information that we get from Facebook. eg. User's location, language preferences, friends using the app, etc.
- Additional information regarding Facebook Framework: https://developers.facebook.com/docs/graph-api
Documentation on SDKs for iOS,https://developers.facebook.com/docs/ios, and Android, https://developers.facebook.com/docs/android.
Supporting Documents:
- Existing_FB_App.zip - screenshots of previous Bible.Is Facebook app
- BibleIs_Brand_Guide.zip - Branding guidelines for Bible.Is app (for reference)
Screen Size:
- Mobile: Design for Responsive in mind, but you can use iPhone 6 dimensions 750x1334 for a starting point
- Desktop versions would be helpful to show your IA and UX thinking for the app!
Desired User Scenario:
- The user logs in to Facebook and navigates to the Bible.Is app, and is presented with Bible content and options in their native language (detected from Facebook), and is also presented the option of changing the language.
- They can browse through different sections and verses, and can listen to their selection through an interactive player (with playback options, ability to highlight and save certain content, etc - we are open to any ideas you may have)
- User should be able to share their selected content with friends
- Some kind of gamification activity: user is encouraged to perform certain functions in order to gain points
- User can leave comments or engage in a discussion with other users, on selected section of Bible content
- User will have the ability to have a group discussion (via video-chat)
Important Features:
- Leveraging Facebook's ability to know who you are, to provide language-specific content
- Would like video chat functionality where users can discuss the Bible together, kind of like an online group discussion
- Gamification around app activity (we are looking for your ideas here)
eg. -- Invites sent from the App (10 points)
-- Listening to a verse (10 points)
-- Sharing a verse with friends (5 points)
-- Adding a comment on a verse (5 points)
- Space for advertising other Bible.Is products
Wireframe Requirements:
This is just a rough outline of the features that need to be covered - please feel free to restructure all this content for the best possible UX.
1. Landing Page:
- The first page the user sees when navigating to the Bible.Is Facebook app, so like a welcome screen
- The user should be able to select a specific section of a specific Bible that they would like to listen to
- Content on this page should be assumed to be displayed in the user's native language. There should also be an option for them to easily change language if they choose to
- Main navigation should include: Bible content, Video Group Discussion, User Profile/Settings or similar
- Area designated for showcasing other Bible.Is products (like ad-space)
2. Interactive Player
- The selected section of the Bible will be played as audio, with the text also displayed alongside.
- The existing comments on the selected verse/section will be displayed
- User should have the ability to Share with friends, or Favorite, etc - any additional features you think may increase user engagement
- Interface for viewing and replying to / adding comments
3. User Profile/Settings
This is the user's personal page where they see information relevant to them, this could include
- Listening history
- Favorites
- Comments/activity log
- Scheduled Bible study video chat sessions
- Points accumulated from app activity
- anything else you think the user may find relevant?
4. Modal Windows
- Wherever the user performs functions like inviting friends, sharing, please show the modals that Facebook would provide to select people from their Friend lists
- Video chat invitations - accept/decline
- Gamification actions: Whenever the user performs an action that gives them points, there should be some way of displaying this (could be a modal, could be inline, up to you)
5. Language Selection
- In case the user would like to see their Bible content in a different language, how do they select a different language?
6. Video Chat
- Assuming a Bible Study group would like to have an online group discussion about specific sections of the Bible, they should be able to set up or join a scheduled video-call
- This needs to utilize video-chat or group-chat functionalities within Facebook, and allow a user to add Friends to a particular chat they set up
- User can receive invitations to join a chat group, how would this look? They need the option to Accept/Decline.
Target Users:
- Users across multiple languages looking to access and discuss Bible content
- Members of a Bible Study program, needing a platform for discussion
Judging Criteria:
- Overall User Experience, and leveraging of Facebook user information to customize the UX
- Completeness and accuracy of the wireframe as defined in the spec requirements.
- How well your wireframes provide a consistent user flow.
Submission & Source Files:
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Generated HTML files with all the requested contest requirements stated above.
Source Files
Wireframes should be built in Axure. The resulting files should have generated HTML files. Also, all the content must be listed and the pages are linked together to show page flow.
Final Fixes
As part of the Final Fix phase, you may be asked to remove, update, or change some features of the wireframe.
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.