Memopol infos and sytle guide

Everything there is to know about the Memopol front end design.

All positions (votes & public positions) belong to two categories: the MEP or group that stand on the position and the Dossier they belong to, depending on the topic.

LQDN's analysis, recommendations or summary can appear at any moment on the site to clarify something or for comparison.

The 2 main categories are as follows:

Members of the European Parliement (MEP)
They can be considered either as individuals or as groups (party / country / committee).
They have the foolowing attributes:
ID card
A list of identifiers (name, groups, social links, πPhone)
+ scores & badges
Everything an individual MEP is involved in. (commissions, committees, ...)
Emphasis is placed on the mandates relevant for LQDN's activities.
Every vote of the MEP or group, compared to other groups votes, final results and LQDN's recommandations.
+ details regarding evolution and scores.
Public positions
All public positions of the MEP or group, in the Parliement or through other medias.
+ can include summary, context or short analysis by LQDN.
They are thematic gathering of infos regarding a specific topic.
They regroup the following elements:
LQDN's opinion
A summary / introduction to the topic
+ a link to all LQDN's positions on the matter (press releases / press review)
+ (in case of current activity) a list of future milestones and possibilities for volunteers to help.
Every vote per group or MEP, final results and LQDN's recommandations.
+ details regarding evolution.
Public positions
All public positions on the topic, in the Parliement or through other medias.
+ can include summary, context or short analysis by LQDN.

What's in it

Access to categories: search bar
The nav has to provide for an easy access to both MEP pages and dossiers. To do so, we are using a search bar (useful for broad searches), that can be unfolded ("more search options") to use more precise key words.
Access to categories: see all MEPS or dossiers
Easy access to all MEP pages and dossiers. When you're not looking for something specific.
Adding a position
Users have to be able to quickly add a public position when they hear one (for example on the radio). Thus a button allows for a modal to appear for a quick addition.

Size and position

On the left

A left sided nav section allows for a consistency between desktop UX and mobile UX. With the incresed use of mobile phone, people are getting used to this kind of interaction. Moreover, it allows for more space on the screen as the section is foldable, and it is always accessible, and not stuck at the top of the page.

Large view

For extra large views, the nav is always visible.

Small view

The nav is accessible either by an icon or a left-edge overflowing that unfolds to the right when clicked or touched.


Main color: white

For backgrounds & default options

Primary color: LQDN's blue

Color consistency with LQDN's main site

Heading color: Dark grey

Good readability.

Text color: Lighter grey

Good readability, not too much contrast.

Attention les alertes comme celles-ci devraient ĂȘtre bleu-quadrature.


Title font
Helvetica Neue
Text font

Make it responsive on small screen

Make it printable