APP MOCK UP 1.2

125
1 APP MOCK UP 1.2 Loading Page: Loading Page: Loading Page will have Loading Screen features: It shows that Page is loading. 1 1

Transcript of APP MOCK UP 1.2

1

APP MOCK UP 1.2

Loading Page:

Loading Page: Loading Page will have Loading Screen features: It shows that Page is loading.

1

1

2

Sign up page:

1 2 3

4

5

7

6

8

3

Sign up page: The Sign up Page will have four options for login

Login with Google+: User Can login with his/ her google+ account

Login with Facebook: User can login by using his/her Facebook credentials

Login with ST Portal Credentials: User Can login by using his/her ST Portal credentials

Login with user id and password: User can login with mobile number and password

If He / She has not yet signed up i.e. they don’t have log-in credentials, he/she has to click on

create new account.

Enter Your Mobile Number

Enter Your Password

1

2

3

Login

5

6

Click On Create New account

Registration Form

7

4

4

Registration Page: This is the registration page for the new users. One can register by entering

His name, Email ID, Mobile no. , Password (as shown in the picture given above). Registration Form

details are given below.

7

7

5

Registration Page Form

Mobile Number or Email ID

Email validation for web / Out of scope (web)

OTP validation for app

6

Forgot Password- If Someone has forgot his/her password, he/she can retrieve the same from

this page. The password can be retrieved by using the registered mobile number as per the

following steps:

1- Click on Forgot Password

2- He/ She will receive one time password on his registered mobile number

3- Enter Your OTP

4- Enter new password and confirm new password

8

8 8 8 8

7

Choose Your Language on the setting menu

Select Your Language Page: On this page, registered user can choose

his/her preferred language. There will be two options:

1. English 2. Hindi

1

1

2

3

1

2 3

8

2. Select Your Exam Page:

Exams icons can be added, renamed.

Option button for single selection

this section can be accessed in setting menu.

1

2

3

4

5

6

7

1

9

Select Your Examination: All Government examinations will be listed

here. A candidate can choose all the exams or anyone of them.

Banking exam Railway

SSC Exam State Level

Insurance Skill India

2

3

4

6

7

5

1

10

Home Screen Page:

Menu bar header and footer icons fixed on page, rest items are scrollable.

11

Home Screen Menu

This is the Home Screen

From to

The top section will have dashboard, search box, notification bell, Banners and a

sub menu of skills.

Dashboard:

Search Icon: students can search available content of the app by using keywords in the search tab.

Search

Notification Bell

Sub Menu of

Skills

Dashboard

Top Menus

Banner

Icons with Quick

Links

1

2

3

4

5

6

8

1 6

12

Notification Bell: Students can get notification regarding offer, video lectures, and important

information related to mahendras. The notifications once readwill be removed.

Banners: Banners can be accessed by clicking.

The Top section of the page will have 7 Tabs:

1- Home

2- Study Material – The Study Material page will cover vocabulary,study notes , strategy and study plan, The Hindu editorial,articles etc

3- Current Affairs-On Current Affairs Page we will provide Daily current affairs,Weekly Current

Affairs,Spotlight,MICA, daily GK update ,Study Notes GA etc

4- Quiz- Quiz page will have subject wise test, topic wise test, free mock tests,speed test report analysis, previous year papers and speed test and solution etc.

5- Myhop- All speed test cards, admission cards E-Books ,E-News will be listed here.

6.Ask Your Query- In Ask Your Query Section, user can ask his/her query and post questions

which other users can like, Answer & Share. This is basically a Discussion Forum.

7.Join Mahendras -In this section we will provide all information related to Mahendras.

There will be six icons on home page with quick links :

a- About Exams b- Study Material c- Speed Test d- Vacancy e- Branches f- Vidoes

NOTE: The above noted content sections can be accessed by scrolling down the home page. And if

user wants to explore any section in detail then he can tap at “view all”.

It will also have 5 sections.

7

8

13

Video Lectures

9

10

11

12

Exam Alert

Free Mock Test

Notice Board

14

Five Sections:

Video Lectures- video lectures of Mahendras YouTube Channel

Exam Alert- Details of Latest vacancies,result and admit card

Free Mock Test- In this section we will provide free mock tests of upcoming examination

Notice Board –

Website Content

Footer Menu and social media icons:

9

10

11

12

13

13

Social Media Icons

Home

Exam Tips ST Portal

Alumni

Live Chat

14

15

16 17 18

19

15

Social Media Icons on footer: Footer of only home page will have links of the social platforms:

1-Facebook 2-Google+ 3-Twitter 4-YouTube 5-Instagram 6-Pinterest

Footer Menu:

Home Home: home button of the footer will enable the student to navigate back to the home page

Exam Tips - Exam Tips for Students

ST Portal – In This section we we will provide all information related to ST Portal.

Videos - Video lectures of YouTube channel

Live Chat- online chat and help desk for quick redressal of students’ issues.

14

15

16

17

18

19

16

Home Screen First Icon: About Exams: On About exam page all icons are coming from CMS Panel. W----

----hen student clicks on icon the details of that exam will appear as collapsible screen. The details

regarding the upcoming examination will get updated through CMS panel.

17

Section 1- Videos Lecture: All You Tube videos can be accessed only through the app.

18

Section 2- Exam Alert: Here we will provide exam related information ex. vacancy updates, admit

card, exam result. The details regarding the upcoming examination will get updated through CMS

panel.

19

Vacancy: The details regarding the upcoming vacancies will get updated through CMS panel.

20

21

Blog Website Content: In this section you will get to see the content of the website.

22

My Dashboard

8

9

10

11

12

13

14

15

16

7

6

5

4

3

2

1

23

My Dashboard Page

It will be divided into two sections:

1. My Section 2. Others

My Section

My Profile: It will have a record of personal details of students. The record includes name,

location, DOB, and will also have an option of profile image. Students who are logged in can update his/ her personal details from here.

1

1 1

24

My Downloads: In this section all the downloaded files by the students will be displayed. All

downloaded content in respective categories will be listed here. Files will be opened in separate

window / pdf/viewer

2

25

My Bookmarks: From this section all saved pages and questions can be accessed. Students can

share and remove this questions.

3

26

My Shop: A student can purchase online test series, E-Books, E-News and can also take admission.

This page will have six icons followed by two sections.

4

4

27

Speed Test: Speed Test option will contain Online Speed test.

5

28

About Us: About Mahendras

6

29

Branches: Mahendras 151 Branches will be listed here:

7

30

When Student clicks on Request call back option, thank you page will appear on next screen

31

2-Others

Settings: User can change language settings, font size, Night mode settings and sound settings

from settings page available on dashboard menu. For Font size there will be a dropdown menu with 3

options.

1. Small 2. Medium 3. Large

Refer adda247 app.

8

32

Rate App: It will be redirected to google play store.

Share App- Students can share Mahendras app to his/ her friends via facebook, Whatsapp and

Gmail share it and others.

9

10

33

Invite Friends: Students can share Mahendras app to his/ her friends via facebook, Whatsapp

and Gmail share it and others.

11

34

Like Us – It will be redirected to facebook page.

Contact Us-

If student clicks on click here for branch contact it will be redirected to mahendras branches page.

12

13

35

Privacy and Terms: Terms and conditions between a student and Mahendras.

14

36

Logout Page: Student can logout from his/her account from

dashboard.

15

37

Study Material Tab: The Study Material page will cover vocabulary,study notes , strategy

and study plan, The Hindu Editorial, Articles. This page will have six icons followed by two sections-

The details regarding the study material will get updated through CMS panel.

1. Editorial 2. Articles

If student clicks

on view all the

content screen 02

will appear. The

layout of the

same is available

on the next page

38

Section -Editorial: If students clicks on view all list of that particular content having Date, Title, and

Link to be Open. Students can download its pdf, share it and bookmark it for offline access. It will also

have a feature of content filter. Editorial once clicked and opened will be treated as READ.

If student clicks on any of

listed content screen 02

will appear. The layout of

the same is available on

the next page

39

Editorial Screen 02-

40

Section Articles: Students can share it and bookmark it for offline access. It will also have a feature of

content filter. Article once clicked and opened will be treated as READ.

If student clicks on

any of listed content

screen 02 will

appear. The layout of

the same is available

on the next page

41

Article Screen 02

42

Vocabulary: On this page we will provide vocabulary on daily basis. Student can download its pdf

from this page. There will be a calendar filter option for students to select previous date vocabulary.

Vocabulary once clicked and opened will be treated as READ. The details will get updated through CMS

panel.

If student clicks on

any of listed content

screen 02 will

appear. The layout of

the same is available

on the next page

43

Vocabulary screen 2

44

Study Notes: This page will have six icons of Reasoning, English, Computer, Quantitative Aptitude,

General Awareness and General Studies. Student can download study notes pdf from this page

45

Study Notes Screen 01

46

Study Notes Screen 02

47

Strategy and Study Plan: On this page we will provide strategy and

study plan for upcoming government exam.

48

Strategy and study Plan screen 02

49

Interview: On this page we will provide tips and tricks for an interview

50

Current Affairs Tab: Current affairs page will have six icons and two

sections.

51

Daily Current Affairs screen 01

If student clicks on

any of listed content

screen 02 will

appear. The layout of

the same is available

on the next page

52

Daily Current Affairs screen 02

53

Weekly Current Affairs: On this page we will provide weekly current

affairs pdf with calendar filter option.

Note: The flow of the upcoming screens will be same as shown in daily current affairs

54

Study Notes GA

It will be redirected to study notes GA which is available in study material tab

55

MICA

Note: The images of the upcoming screens will be same as shown in daily current affairs

56

Daily GK Update

Note: The flow of the upcoming screens will be same as shown in daily current affairs

57

Spotlight

58

My shop Page: My shop page will have six icons followed by two

sections. Students can purchase online speed test series, MICA, E-News

from app also.

59

Online Admission: A student can take online admission from here. API

will be provided for the same

If a student will

click on buy now

button following

screen will be

displayed. The

layout of the

same is in the

following page.

60

Note: API will be provided for the same

61

Apply Promo code Page

Payment Screen: Single payment gateway envisioned. On click it will redirected to banking channel API.

62

Payment Screen: Single payment gateway envisioned. On click it will redirected to banking channel API.

63

64

My Transaction: All transactions carried out by students will be shown

here.

65

E-Books: Students can purchase E-books from this page.

If a student will

click on buy now

the upcoming

screens flow will

be the same as

shown for online

admission.

66

E-News: A Student can avail E-News facility by purchasing E-News card.

If a student will

click on buy now

the upcoming

screens flow will

be the same as

shown for online

admission.

67

Ask your Query Tab: On this page, user can ask his/her query and other

users can like, Answer & Share the question. Refer Grade Up App

Ask Your Query Screen 01

This section will

contain all the

questions

previously asked

by student.

Student can check

all the activity on

his/her questions

If student clicks

on this icon

screen 02 will

appear. The

layout of the

same is available

on the next page

68

Ask Your Query 02

Student can post

his/her query via

text message or

can add image of

query

69

Join Mahendras Tab: This page will have every piece of information

regarding Mahendras. It will have six icons followed by two sections:

70

Join Classroom Program: If student clicks on join class room program a

new page will open having five icons followed by two sections.

71

Icons

Courses: All the courses that are available on Mahendras website will

be shown here. It will be redirected to About Exam Page which is

available in home page

72

Facilities: The details of all the facilities provided by Mahendras will be

shown here.

73

Admission: All admission card details of Mahendras will be available

here.

74

Enquiry Form: Enquiry form to generate admission enquiry.

We need data for outbound calling

75

Enquiry Form Data Form Details

Name

Mobile Number

City

Interested In Preparation For

Preferred Batch Timing

Request for Demo

Remarks

76

Branches: On this page we will have three drop down menu of state,

city and branch. A Student can generate admission enquiry and make a

call back request.

77

Career: Students can apply online for job opportunity provided by

Mahendras. The details for the same will get updated through CMS

panel. Only active listing will be shown here.

78

Noticeboard:

79

FAQs:

80

New Batch:

Note: New batches start on every Wednesday

81

Quiz Tab: This Page will have six icons of daily quiz, topic wise quiz, full

length test ,static awareness quiz previous year papers and subject-

wise test followed by two section.

Note: Quiz api will be provided for the same

82

Daily Quiz: On this page we will provide test of reasoning, English,

Computer, Quantitative Aptitude, Banking Awareness and general

Studies on daily basis with calendar filter option.

Note: Quiz api will be provided for the same

83

When student clicks on any of the test, a pop up will appear with the

details of test i.e. no. of questions, time, marks, marks for correct

answer and marks for negative answer.

Note: Quiz api will be provided for the same

84

When student clicks on start test, questions will appear with timer. This

screen will also have a filter option, student can pick any of the

questions of his/her choice by a filter option.

Note: Quiz api will be provided for the same

85

As soon as a student submits the quiz, report and solution screen will

appear with the analysis of attempted questions. He/ She can re

attempt this quiz. This page will also have an option to view solution.

Note: Quiz api will be provided for the same

86

Full length test: On this page we will provide full test based on latest

pattern of pre and mains exam.

Note: Quiz api will be provided for the same

87

When student clicks on any of the tests a pop up will appear with the

details of test i.e. no. of questions, time, marks, marks for correct

answer and marks for negative answer.

Note: Quiz api will be provided for the same

88

When student clicks on start test, questions will appear with timer.

This screen will also have a filter option, student can pick any of the

question of his/her choice by a filter option.

Note: Quiz api will be provided for the same

89

Note: Quiz api will be provided for the same

Dropdown menu

of a subject,

student can

choose any of

the subjects

from here

90

Note: Quiz api will be provided for the same

As soon as you click on

this icon the number of

questions palette will

appear here

91

Note: Quiz api will be provided for the same

As soon as you click on

this icon the list of

questions will appear

here

92

Note: Quiz api will be provided for the same

93

Note: Quiz api will be provided for the same

94

Note: Quiz api will be provided for the same

95

Dashboard Menu: ST Portal-It will have six icons followed by two

sections.

96

My Test: Available test in the ST Portal account of a student will

appear here.

97

My Result: Result status of the test attempted by student can be

accessed from here.

Note: Quiz api will be provided for the same

98

Attach OTP: Students can attach New OTP that he will purchase for a

new card on this page.

Note: Quiz api will be provided for the same

99

Reserve Seat: From this page a student can reserve seat for lab speed

test and seminar.

100

101

Reserve Seat for Bank/SSC

Course

City

Center

Speed Test

Date

Time Slot

Available Seat

102

103

Reserve Seat for Seminar

Venue (Fixed)

Name

Email Id

Mobile Number

Are You Student of Mahendras

104

Payment & Dues:

Note: Quiz api will be provided for the same

105

Note: Quiz api will be provided for the same

106

Note: Quiz api will be provided for the same

107

ST Schedule: On this page we will provide schedule of speed test

running in branch lab.

108

Second dashboard Menu:

Skill India: On this page we will provide details of Mahendra skills. This

Page will have six icons and one section.

109

Second dashboard Menu:Skill India: On this page we will provide details

of Mahendra skills. This Page will have six icons and two sections.

About MSTDPL: About Mahendraskills

110

Course: On this page we will provide course details of Mahedra Skills.

This Page will have six icons of available courses of Mahendra Skills.

111

112

Offerings: On this page we will provide the details of different projects

running by Mahendra Skills.

113

Placement: On this page we will provide placement details of

Mahendra Skills.

114

Careers

115

PMKVY: On this page we will have dropdown menu of PMKVY.

PMKK 2. IISC

116

117

Support:

API will be provided

118

119

120

Footer Menu

Exam Tips

121

122

Alumni: On this page we will provide the details of selected candidates.

Candidate can share his/her success stories. Other students can share,

like and answer success stories.

123

Registration Form: Selected students can register his/her details through this form.

124

Registration Form:

Name

MIBS Roll Number

Email ID

Mobile Number

Selected In (Dropdown Menu)

1. Bank 2. SSC 3. Railway 4. State Level Exams 5. Others

Organisation

Post

Selection Year

State

City

125

Live Chat