iLokSabha.

in (Home) (Page# 1)
Following is a screen shot (four parts) of tentative design for the home page of iLokSabha.in. You
can also see the website in order to get a feel of the design.
HEADER
Following the standard header logo, the tet and the menu. Stud! the "#$L % st!lesheet code to
maintain consistenc! of header across all pages of the website.
SLIDER & TEXT
Slider and the associated tet with the image. &suall! this will contain what's happening in Lok
Sabha (()
th
*arliament of +ndia) source of information is defined from the administrative page
content that handles this top part of the home page and is d!namic in nature. ,dmin user has the
abilit! to change it when desired.
Following is the second screen shot of home page.
#op part is followed b! - rows with . columns of d!namic loading of $* lists from $* master
lists. +t displa! the photograph in a specific si/e format with the name in capital and bold. Second
line with the constituenc! name and followed b! state name to be separated b! comma. *art!
name in bracket. Si/e and St!le adherence is re0uired as per the sample to maintain aesthetic appeal
of the user interface.
Following is the third screen shot of the home page.
,s !ou can notice from the above image, a third row is present. So total of - rows with . images in
each row is re0uired for displa!. , d!namic loading of the grid is re0uired.
Following the fourth screen shot of the home page.
- sections namel!, top two panels, left and right and a bottom panel, followed b! the footer (footer
is not included in the above image).
TOP LEFT PANEL
Slider displa!s work completed photograph b! featured $*'s (as defined in the admin interface).
#itle of the work, posted date, comments count and the tags associated. 1ottom tet of the
photograph displa!s first (22 characters and a 3ead more (h!perlink) link that points to the article
in detail.
TOP RIGHT PANEL
Statements b! the $*'s displa!ed in the bottom photographs. #hese are all first4timers to the ()
th

Lok Sabha and are highlighted based on the admin interface selection. 5!namicall! displa!ed
depending on the selected $*'s for displa! here. +t keeps changing ever! few weeks or months
depending on admin re0uirement.
BOTTOM (Priot to footer)
Four columns with first ver! much static information with a link to the about us page.
Second column (using #witter integration) to displa! the tweets (selected b! admin interface)
#hird column (news feeds) to displa! the latest news articles (selected b! admin interface)
Fourth column (photo galleries) to displa! links to view photo galleries (submitted b! users, $*'s,
ministries and ever! one that use and want to highlight works relating to Lok Sabha) defined b!
the admin through admin interface.
MP Dashboard (External) (Page# 2)
#his dashboard is part of the $* dashboard front4end pro6ect and is available to all visitors to the
website. Following is the screen shot (in two parts) of tentative design and each displa! elements
are defined at high level below the screen shot.
For MP Dashboard (External) - Available to non-registered users
(see sample: shatrughan sinha & bhartruhari mahtab)
HEADER
4 follow the standard header
LEFT PANEL
4 5ashboard options (available onl! to registered users)
#his contains the links to the information in internal dashboard 4 available onl! to registered
users
who re0uested the $* +5 assignment.
4 news feeds
4 title
4 short title
4 date
4 associate $* +5
4 short image 7272 (asset readiness)
4 testimonials b! constituents8registered users who re0uested the $* +5 be assigned
4 two latest testimonials to be displa!ed in the format as shown in sample
CENTRE PANEL
4 #itle of the $* 9 (:;lected constituenc!<, :State name<)
*reservation of content within the re0uired st!le element is mandator!. Shorten the name or
the constituenc! or the state name, in cases where re0uired.
4 $* photograph (preserve the source of information, if taken from the web. +t is important that we
provide credit from where we took the photograph)
4 7 to (2 line description of $* (see sample for information)
4 #wo columns
4 work re0uest4( = +nformation on work re0uest generated b! $*
4 work re0uest4> = +nformation on work re0uest generated b! $*
*rovide a link more information on details of the work re0uest (linking to the internal dashboard 4
onl! available to the registered users, who re0uested access to $* information)
RIGHT PANEL
4 5ashboard login
4 ,llow input of user name and password (if the user is not alread! logged in)
4 5ispla! the user id for logged in user= 3amchandra, *atna (include cit! name from user
master)
4 ? of comments, testimonials, re0uests to his constituenc! $* (re0uest to other constituent
$* not allowed in phase4() 4 for a logged in user
4 #here are three tabs under more info.
4 @omments= displa! comments here about the $* from all users. (remember= registered
users onl! can post comments, no one else can. comments are filtered for abusive language etc.
prior to being posted for an $*)
4 #weets= &sing #witter ,*+ integration displa! the tweets b! an $*. $* twitter account is
available from the candidate affidavit while filing for the election nomination.
44 5ispla! A$* doesn't use #witterA
4 +f $* doesn't use #witter, displa! comments from our platform posted to constituent
references or messages sent to our internal $* platform.
4 ,ccordian e0uals to the term the $* held in Lok Sabha % 3a6!a Sabha
4 For progress bars summari/ing the performance in ke! areas. progress bars ma! range
from ( to (2 4 depending on the ke! areas decided later on. (sample displa!s the sample ke! areas
and not finali/ed)
BOTTOM
4 follow the standard footer
Searh !our MP (Page" #)
#wo rows and si columns are displa!ed d!namicall! based on the selection in the top .
dropdowns. 5efault is loaded from the featured database table.
List can be filtered for a *arliament (meaning (.
th
Lok Sabha, (B
th
Lok Sabha or ()
th
value ma! be
between the da! we got freedom to now).
#!pe of member means a member in ra6!a sabha or lok sabha, nominated or elected.
Statewise or &# wise selection is available.
@onstituenc! selection is available.
,ll four dropdowns work in relation with one another.
$pdates (Page" %)
#his page lists the updates to the website. ,s we gather the $* information, we keep releasing the
static pages first. ,longside, we are developing a completel! d!namic website, which is being
planned to be released in the end of ,ugust >2(. or mid4September >2(..
#eam members= #he page displa!s all team members profile in detail ecept the private information
like address etc. #eam includes students undergoing political science stream in various colleges
across ,hmedabad and technolog! students from C#&.
Sponsors, supporters % active participants= De are working on bringing other organi/ation to
support us, if that works out, it will displa! it the specified area (see image below).
Following is a screen shot of &pdates tentative design page.
Summar!
Everall, the website onl! consists of around ) to (2 web pages but all are d!namic and to be built as
specified in the pro6ect re0uest document (*5F) earlier. &sing open source software is ke! to the
development as ultimatel! this ma! go as recommendation F+@ for either update or as4is adaption
of the website.