Skip to content

WIP: GSOC 2019 Mock ups for Agora Android application: Mahesh Paliwal issue #91

MAHESH PALIWAL requested to merge immappie/Agora-web-frontend:master into master

issue #91 (closed) Given below are my UI mockups for Agora-vote android application.

Through my app I have tried to maintain a seamless user experience thus maintaining consistency with the Agora-vote website. With close attention to detail, I have incorporated every functionality available on the website at users's fingertips including the design, color and gradient.
APP Icon

Screenshot_2019-04-09-19-24-59-814_com.miui.home

Splash Activity

I have incorporated a splash screen to ensure user engagement while the app is loading.(With Spinning Logo)

Screenshot_2019-04-09-08-34-09-036_com.maheshpaliwal.agora_android

Splash activity will redirect user to Sign-In Activity when app is loaded. (But if user has installed app for the first time then it will redirect user to App intro activity)

App Intro (Will run only once)

Screenshot_2019-04-09-08-40-23-094_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-40-25-626_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-40-27-957_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-40-30-006_com.maheshpaliwal.agora_android

Push Notification of ongoing elections

WhatsApp_Image_2019-03-30_at_7.21.49_PM

SignIn Activity

Screenshot_2019-04-09-08-33-48-826_com.maheshpaliwal.agora_android

The app is in sync with standard industry practices followed in sign-in activity thus showing error at appropriate places.

Screenshot_2019-04-09-08-33-29-906_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-33-13-819_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-33-19-495_com.maheshpaliwal.agora_android

While waiting for a response from server during user sign-in/sign-up/forgot password or any other activity, the user is showed a rotating loader (Spinning Logo In Place of Button).

Sign Up Activity

Screenshot_2019-04-09-08-45-11-312_com.maheshpaliwal.agora_androidScreenshot_2019-04-09-08-45-15-740_com.maheshpaliwal.agora_android

Screenshot_2019-04-09-08-46-40-265_com.maheshpaliwal.agora_android

ForgotPassword

WhatsApp_Image_2019-03-24_at_12.24.16_PM__3_WhatsApp_Image_2019-03-24_at_12.24.16_PM__4_WhatsApp_Image_2019-03-24_at_12.24.16_PM__5_

Main Activity

Main Activity contains dashboard, create election , elections and profile as bottom navigation. The bottom navigation bar acts as a handy tool for users to navigate to important fragments of the app.

The top bar is provided with a navigation drawer, Agora logo and a notification icon for active elections and voting results.

Screenshot_2019-04-09-08-48-59-906_com.maheshpaliwal.agora_android

The navigation drawer provides user easy access to commonly used features.

Screenshot_2019-04-09-08-50-05-600_com.maheshpaliwal.agora_android

Dashboard Fragment

dashboard loading ( while fragment is fetching data from server)(loader ShimmerLayout)

Screenshot_2019-04-09-00-32-06-418_com.maheshpaliwal.agora_android

Screenshot_2019-04-09-08-48-59-906_com.maheshpaliwal.agora_android

Profile Fragment

Screenshot_2019-04-09-08-51-54-206_com.maheshpaliwal.agora_android

Elections Fragment

The election fragment provides user easy access to tabbed fragments that include all, pending, active and finished elections.

ALL, PENDING , ACTIVE, FINISHED

Screenshot_2019-04-09-08-53-16-451_com.maheshpaliwal.agora_android

Create Election

Although elaborate, the create election fragment enables user to easily create an election.

Screenshot_2019-04-09-08-54-20-666_com.maheshpaliwal.agora_android__1_Screenshot_2019-04-09-08-54-25-312_com.maheshpaliwal.agora_android__1_Screenshot_2019-04-09-08-54-27-546_com.maheshpaliwal.agora_android__1_Screenshot_2019-04-09-08-54-33-763_com.maheshpaliwal.agora_android__2_Screenshot_2019-04-09-08-54-41-414_com.maheshpaliwal.agora_android__2_Screenshot_2019-04-09-08-54-44-867_com.maheshpaliwal.agora_android__2_Screenshot_2019-04-09-08-54-54-396_com.maheshpaliwal.agora_android__2_

Voting Process

Preferential Ballot

Screenshot_2019-04-09-08-59-26-048_com.maheshpaliwal.agora_android

Range Ballot

Screenshot_2019-04-09-21-54-35-159_com.maheshpaliwal.agora_android

Score Ballot

Screenshot_2019-04-09-21-54-44-932_com.maheshpaliwal.agora_android

showing user list of elections which are active (condition: user is in voter list)

cast_vote_step1

Edit Elections

Screenshot_2019-04-09-09-01-25-986_com.maheshpaliwal.agora_android

Election details for user (on clicking view button)

Basic

Screenshot_2019-04-09-09-03-08-516_com.maheshpaliwal.agora_android

Voters

Screenshot_2019-04-09-09-03-11-492_com.maheshpaliwal.agora_android

Ballots

Screenshot_2019-04-09-09-03-13-321_com.maheshpaliwal.agora_android

Results

Screenshot_2019-04-09-09-03-15-093_com.maheshpaliwal.agora_android

About Agora

Screenshot_2019-04-09-09-05-35-634_com.maheshpaliwal.agora_android

Help

Screenshot_2019-04-09-09-06-42-603_com.maheshpaliwal.agora_android

Notifications Layout

Screenshot_2019-04-09-09-17-19-468_com.maheshpaliwal.agora_android

Thanks For Your Time

Edited by MAHESH PALIWAL

Merge request reports