QuizU ⌛

Flutter

By
Okoul
418 participants

Developing a Flutter mobile app where users answer the maximum number of questions within 2 minutes

Career

Companies interested in hiring challenge winners

Judges

Description

Developing a Flutter mobile app where users answer the maximum number of questions within 2 minutes

General Rules

  • Please make sure you have a clean UI
  • Please make sure files and folders are properly organized
  • Make sure all design items, libraries and any other resources are properly licensed
  • You may extract and use the icons available in the Figma file here
  • Anything not stated below is room for your creativity!

Deliverables

GitHub source (please upload your source code to GitHub and share repository link)

Android APK


Functional Requirements

NOTE: To better understand the functional requirements please look at this Wireframe

Login

The user logs-in using his mobile number and the OTP, the OTP is always 0000
If the user has not logged-in previously, he is asked for his name

Tabs

The application has 3 tabs:

  • Home
  • Shows text and a button to start a quiz

  • Leaderboard
  • Shows the top 10 scores for all users

  • Profile
  • Shows the user's name and mobile
    Shows a logout icon, if clicked, user needs to login again
    Shows the user's previous scores
    User should stay logged-in until Logout icon is clicked

Quiz

When the "Quiz Me!" button is clicked the quiz is started right away
A 2-minute countdown timer is started
Each question has 4 choices and one correct answer
If the user selects the right answer, next question is shown
There is a skip button that can be clicked only once, the skip functionality can be used only once per quiz
If the user chooses a wrong answer a screen is shown with a "Try Again" button, clicking it starts a new quiz
Also, if the user chooses a wrong answer, score is not saved
If the time is up a result screen is shown with the number of correct answers and a share button
the share button should launch the system default and allows the user to share the following text:
"I answered X correct answers in QuizU!" (where X is the number of correct answers)
Sharing should be possible on Twitter and WhatsApp + any other apps u like
User's score should be saved
If "X" is clicked on the result screen or wrong answer screen, the user is redirected to the Home screen

Bonus: Create intro screen on app launch

Bonus: Animations


Technical Requirements

NOTE: Here is the API documentation

Token

The app checks if the token is valid on app launch. If so, home screen is shown
GET https://quizu.okoul.com/Token
if token is invalid or non-existent, login screen is shown.

Login

When the user clicks "Start" there is no call to the server, the call is done after "Check" is clicked on next screen
correct OTP is always 0000 but should still be checked at server using the call below
POST https://quizu.okoul.com/Login
Returns:
1- Bearer token
2- Status, either new or returning, if returning also returns Name, Mobile
*Please use this library to validate the mobile number:
https://pub.dev/packages/phone_number
*Client-side validation should be done to check if mobile or OTP is empty and an error message is shown accordingly

Name

If the user is new, the name input screen is shown, when done is clicked the name is updated in the server
POST https://quizu.okoul.com/Name
Returns:
1- Name
2- Mobile
*Client-side validation should be done to check if Name is empty and an error message is shown accordingly

Leaderboard

Top 10 scores (names and count of correct answers are retrieved from server) and displayed sorted descending by count of correct answers
GET https://quizu.okoul.com/TopScores

Profile

Name and mobile are displayed
previous scores for the logged-in users is shown from local storage, sorted by date descending
If the logout button is clicked the token is deleted form local storage, no server call is made
If at anytime, you would like to get the user's info, please call GET https://quizu.okoul.com/UserInfo (make sure your token is valid)
Returns:
1-Name
2-Mobile

Quiz

When the quiz is started, GET https://quizu.okoul.com/Questions is called returns 30 questions with their answers Returns:
{question, option 1, option 2, option 3, options 4, correct option: X}

Score

When the quiz is completed correctly the score is saved to server
POST https://quizu.okoul.com/Score
Also save the score locally on local storage to be used in Profile tab