Upload
abdoul93700
View
119
Download
2
Embed Size (px)
Citation preview
Pôles de l’agence
Langage visuel
# #Pôle graphisme Pôle communication Pôle développement web
Pôles de l’agence
Langage visuel
# #Pôle graphisme Pôle communication Pôle développement web
Pôles de l’agence
Langage visuel
# #Pôle graphisme Pôle communication Pôle développement web
l’agence - l’équipe et ses valeurs
Anne Jacquinot
Axèle Fatôme
Thibaut Marquis
Hamza Tei
Selim Ammari
Wajdi Abdoul
passion générosité savoir-faire
l’agence - son identité
a bbba ab b b b b deb
a
a
b
b
b
b
a
a
-><-
b
Agencement des élements
Logotype
l’agence - son identité
les cartes de visitele site webhttp://agence-logic.site88.net/Logic/
la newsletter
Lettre d’information n°1Janvier 2013
#ACTUALITES
Aborpor moditat as aut exerci blaborum il minto magnita sperum as aspello rrovidemposa dissed untis molorae simus nit dem aute voluptatemod utemper natur?Haribus erio etur si ut desequi ut eum rest quam nem quae. Rem velesedias sinulpa runtur, tem re odipiciatem dolora nobisquibus atur mil ma dellanda porerro coribus untur ad ut expera aut a nos nem et et etur aut minctur? Quidus eaquidunt modicto mosam volupta nosam fuga. Ideruptatet laborro voluptatest, oditios necuptatus.Tum, voluptur ratiur sunt lique velectur?Equia dolupta conse plabor repraerum fugiat magnat et qui sunto odisciis ellatur, aspella qui re nobis a ipsunda a debisci umquam, quia nonseque voloren ditatius molorem autentur sus andi doles eos eatur sunt.Ut faccus rehene ex explis dolupta diorerro consequodit dolum rem qui quas dolorum estem sa aut aut
#
# SocialdesignjQuery & WordPress Plugins
The Nivo Slider has become the most popular image slider availble on the
web today. What started as a side project quickly became a huge suc-
cess, celebrating over 1 million down-loads in its first year. In addition to the jQuery plugin a WordPress plugin has
further boosted the success of the slider, making the Nivo Slider one of
the biggest premium plugins in the WordPress premium plugin market at
the moment.
# MinimalismWeb App
Sellwire is a new web app born out of a lack of good options for selling digi-
tal goods online. Sellwire aims to make selling digital goods as simple as
possible, literally upload a file and share a link, and takes care of the
complex e-commerce payment gate-ways and tracking stuff so that users can focus on making great products.
Now out of beta, Sellwire continues to grow and hopes to become a promi-
nent competitor in the ecommerce market.
# LightdesignWordPress Plugin
Often before you launch a site you want to get some real users in to test
the site without allowing access to the rest of the world, normally known as "closed beta" testing. This plugin was
built for startups who want to turn their WordPress site into a closed
beta site without touching any code. Closed Beta is a powerful plugin with
a built in user approval system and splash page customiser.
# LogicdesignWordPress Plugins
Showcase is a premium WordPress plugin and was created out of a frus-tration at the lack of good gallery functionality/plugins for WordPress at the moment. Showcase aims to redefine the "gallery" in WordPress by making the whole process of up-loading, ordering and editing your images as simple as it can be. Then it makes your gallery look stunning by automatically showing your gallery in a beautiful lightbox slideshow. Not to mention built-in features like dynamic image resizing and simple lightbox theme changing.
# InteractivityWeb App
WP Updates is a web app that allows WordPress premium theme and plugin authors to easily provide auto-matic updates for their themes & plugins. WP Updates provides a simple interface for managing ver-sions of themes/plugins without having to touch any code. Again this was an app built on top of processes and workflows that we already had created internally at Dev7studios and decided we should share it with the world.
# MobilityWeb App
WP Updates is a web app that allows WordPress premium theme and plugin authors to easily provide auto-matic updates for their themes & plugins. WP Updates provides a simple interface for managing ver-sions of themes/plugins without having to touch any code. Again this was an app built on top of processes and workflows that we already had created internally at Dev7studios and decided we should share it with the world.
# Logic has become the most popular image slider availble on the web today. What started as a side project quickly became a huge success, celebrating over 1 million downloads in its first year. In addition to the jQuery plugin a WordPress plugin has further boosted the success of the slider, making the Nivo Slider one of the biggest pre-mium plugins in the WordPress premium plugin market at the moment. Lorem ipsum.
Je m’inscris à la newsletter !
Équipe BlogCréations
E-mail : [email protected] rue des Ponts, 13480 PARIS
Équipe BlogCréations
E-mail : [email protected] rue des Ponts, 13480 PARIS
Équipe BlogCréations
E-mail : [email protected] rue des Ponts, 13480 PARIS
Équipe BlogCréations
E-mail : [email protected] rue des Ponts, 13480 PARIS
Pôle graphisme
The Nivo Slider has become the most popular image slider availble on the web today. What started as a side
project quickly became a huge suc-cess, celebrating over 1 million down-
loads in its first year.
Pôle communication
The Nivo Slider has become the most popular image slider availble on the web today. What started as a side
project quickly became a huge suc-cess, celebrating over 1 million down-
loads in its first year.
#
Pôle développement web
The Nivo Slider has become the most popular image slider availble on the web today. What started as a side
project quickly became a huge suc-cess, celebrating over 1 million down-
loads in its first year.
#
Effet en hover du coeur(et en clique sur smatphone)
la “banière” fait toute la largeur de la page
Effet en hover d’un lien(et en clique sur smatphone)
Anne JacquinotDirecteur artistique
Thibaut Marquisgraphiste web/print
Axèle Fâtomegraphiste web/print
Hamza TeiResponsable technique
Selim AmmariDéveloppeur/ Intégrateur
Wajdi AbdoulDéveloppeur/ Intégrateur
Anne JacquinotDirecteur artistique
Thibaut Marquisgraphiste web/print
Axèle Fâtomegraphiste web/print
Hamza TeiResponsable technique
Selim AmmariDéveloppeur/ Intégrateur
Wajdi AbdoulDéveloppeur/ Intégrateur
le projet - le commanditaire
PORTRAIT
b Benjamin Racine
b musicien amateur
b doctorant en Philosophie
SON PROJET
b réalisation de l’album « The night »
b réalisation du court-métrage « The night »
QUELLE EST LA PLACE D’UN SITE WEBDANS LA STRATÉGIE DE COMMUNICATIOND’UN ARTISTE ?
LES BESOINS
b déterminer un univers visuel
b faire connaître sa musique
le projet - les besoins et la problématique
le projet - le benchmark
birdynamnam.com
le projet - le benchmark
emilyloizeau.fr
le projet - le benchmark
thetape.eu
le projet - le S.W.O.T.
12 13
forces faiblesses
b universalité de la musique
b gratuité du fichier audio
b facilité de se différencier dans ce marché par rapport à la concurrence.
b style musical peu connu
b marketing limité
b mise en place d’un site internet avec un style graphique précis
b budjet limité
opportunités menaces
b attirer avec un nouveau style musical
b création d’une base de donnée client
b concurrence
b gratuit donc non rentable
swot
le messageLa musique de My Name is J (MNIJ) s’ancre dans une atmosphère musicale complexe, dans un esprit narratif voire onirique. Le compositeur nous em-mène dans une histoire, un épisode musical. Le message en lui meme est abs-trait car le public peut faire sa propre interpretation de la musique. Ce type de musique étant peu connu, il ya a donc aussi un message caché qui est l’in-novation. Le public est transporté dans un monde qui lui est complétement inconnu.
I - Accuptur am
II - Tibus ex eume
III - Nequunt fugiae vendite
IV - Ut velestium imendanda
V - Corecte qui blati
VI - Que pe quo corisimet
VII - Que pe quo corisimet
Get album free
The night (Film)
launch film
Lorem ipsum dolor sit amet vir,capsum turi la facha mina.
Info
launch trailer
my name is j.
I - Accuptur am
II - Tibus ex eume
III - Nequunt fugiae vendite
IV - Ut velestium imendanda
V - Corecte qui blati
VI - Que pe quo corisimet
VII - Que pe quo corisimet
Get album free
The night (Film)
launch film
Lorem ipsum dolor sit amet vir,capsum turi la facha mina.
Info
launch trailer
my name is j.
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
my name is j.
MaQuette écran d’accueil et blog
LA CIBLEPRINCIPALE
- jeunes actifs de 15-35 ans- culture générale- arts- curiosité- région de Nancy
le projet - la cible
LA CIBLESECONDAIRE
- personnes actives ou non de 15-45 ans
- culture générale- arts- public non-averti
b création d’une identité visuelle
b création d’un site web
b réalisation de communiqués de presse
b campagne d’affichage urbain et distribution de flyers
la communication - la stratégie
le graphisme - l’univers musical
b atmosphère musicale complexe
b Trip-hop
b esprit narratif
le graphisme - ses références artistiques
b le Minimalismeb Kandinsky
b le Vorticismeb le Futurisme
b le Suprématisme
moodboard - Abstraction géométrique
formes déclinées
logotypes géométriques
géométrie dans l’espace
nuitée
mise en abîme
logotype génératif
éléments identitaires abstraits
mise en relief
3 dimensions
mouvements lumineux nocturne
dédales géométriques
paysage urbain
abstractions, libre interprétation
submergement émotionnel
le graphisme - le moodboard
moodboards - jeu d’abstraction / cartographie
photographieexpérimentée
semi-figurationd’éléments urbains
topographie
vibration sonore
narration
le graphisme - le moodboard
logotype - pistes graphiques
Piste 1 Piste 2
Piste 4
Piste 3
Piste 5
logotype - ébauches
logotype - pistes graphiques
Piste 1 Piste 2
Piste 4
Piste 3
Piste 5
logotype - pistes graphiques et développement
Piste 1 (logo évolutif)
Piste 2
Piste 3
Piste 3 Piste 4
my name is J
logotype - pistes graphiques et développement
Piste 1 (logo évolutif)
Piste 2
Piste 3
Piste 3 Piste 4
my name is J
logotype - pistes graphiques et développement
Piste 1 (logo évolutif)
Piste 2
Piste 3
Piste 3 Piste 4
my name is J
logotype - pistes graphiques et développement
Piste 1 (logo évolutif)
Piste 2
Piste 3
Piste 3 Piste 4
my name is J
MY NAME IS J
MY NAME IS Jthe night
the night
le graphisme - les recherches de logotypes
déclinaison infiniedu symbole
Les parties textuelles et visuelles peuvent s’utiliser séparément, en fonction du support choisit.
Pour le web, on préconisera l’usage seule de la typographie et le symbole servira de support à
des expérimentations interactives.
utilisation du logotype.
taille minimum du symbole100px / 15mm taille minimum du nom10pt
composé enBoton medium italic
taille minimum200px
deux présentations possibles du logotype
MYNAMEIS J.
MYNAMEIS J.
my name is j.
my name is j.
déclinaisons du symbole pour utilisations
experimantales (voir page précédente).
utilisation du logotype.
le graphisme - l’identité visuelle
la pochette de l’album "The night" l’affiche promotionnelle la newsletter
MYNAMEIS J.
ACTUALITÉSÉVENEMENTS / NEWS / INFOS
Vbi curarum abiectis ponderibus aliis tamquam nodum et codicem difficillimum Caesarem convellere nisu valido cogitabat, eique deliberanti cum proximis clandestinis conloquiis et nocturnis qua vi, quibusve commentis id fieret, antequameffundendis rebus pertinacius incumberet confidentia, acciri mollioribus scriptis per simulationem tractatus publici nimis urgentis eundem placuerat Gallum, ut auxilio destitutus sine ullo interiret obstaculo.
Fuerit toto in consulatu sine provincia, cui fuerit, antequam designatus est, decreta provincia. Sortietur an non? Nam et non sortiri absurdum est, et, quod sortitus sis, non habere. Proficiscetur paludatus? Quo? Quo pervenire ante certam diem non licebit. ianuario, Februario, provinciam non habebit; Kalendis ei denique Martiis nascetur repente provincia.
NEWS
En savoir plus >>>
En savoir plus >>>
ÉVENEMENTS
www.mynameisj.com
le graphisme - exemples d’application
la conception - le zoning
par défaut : teaser (ou chapitre séléctionné)
Marge d’ajustement
Limites de l’écran du visiteur
Mouvement lié à une action de l’utilisateur
Marge d’ajustement
I - Accuptur am
II - Tibus ex eume
III - Nequunt fugiae vendite
IV - Ut velestium imendanda
V - Corecte qui blati
VI - Que pe quo corisimet
VII - Que pe quo corisimet
Get album free
The night (Film)
launch film
Lorem ipsum dolor sit amet vir,capsum turi la facha mina.
Info
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum... lire l’article
Noms des chansons de l’album correspondantaux chapitres du film.
Liens vers la page Album(contenant une description plus précise du projet etpermettant de téléchargerl’album).
Liens FB/youtube(ouvrant une lightbox)
Titre du film Logo (en transparence pendant la lecturede la vidéo)
Courte déscription dufonctionnement du lecteur.
Barre de progression du filmet réglage du volume sonore.
Prévisualisation du chapitre (avec une image de l’extrait) en hover sur l’un des titre.
En scroll, la partie blog vient se placer au dessus du lecteur (et du bandeau)-> effet parallax.
Le logo reste fixe (il reste par dessus la partie blog) et prend une couleur sombrede manière à ce qu’il reste toujours visible.
(le design du blog est provisoire)
Lorsque l’utilisateur n’estpas en hover sur l’un deschapitre, le bouton playpermet de lancer la vidéo depuis le début (avec une image du film en fond).
(à redimensionner de manière à toujours avoir la vidéo en plein écran)
La fleche indiquant la présence du bandeau change de sens lorsque celui-ciapparait ou disparait et le logo en haut à droite de la vidéo suit le bandeau lorsque celui-ci est en mouvement.
Lorsque l’utilisateur ne bouge pas sa souris, le bouton play ou pause ainsi que les liens de réseaux sociaux, disparaissent progressivement.
SIGN UP FOR EMAILS SUBSCRIBE
Mentions légales et créditsBlablablablabla - 2013
VIMEO YOUTUBE BANDCAMP
MUSIC FILM NEWS CONTACT SITEMAP
Lire plus d’articles ->
À la fin du teaser ou lorsque l’utilisateur place sa souris à gauche du lecteur,le bandeau glisse vers la droite et devient visible.
Lorsque l’utilisateur lance un extrait vidée et/ou qu’il place sa souris en dehorsdu bandeau, celui-ci disparait à nouveau en glissant vers la gauche. Il laisse placeau film ou à l’extrait choisi. Lorsque l’utilisateur a fini de visionner un extrait,les chapitres s’enchainent sans interruption (dans l’ordre chronologique du film).
ZONING FINALSITE WEB MNIJ.
la conception - le site web
page d’accueil
SIGN UP FOR EMAILS SUBSCRIBE
Mentions légales et créditsBlablablablabla - 2013
VIMEO YOUTUBE BANDCAMP
MUSIC FILM NEWS CONTACT SITEMAP
more news
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus.
Vivamus tincidunt vehicula justo ac viverra. Ut suscipit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elemen-tum...
Ut suscipit nisi sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt. Vivamus tincidunt vehicula justo ac viverra.
Read more . . .
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus.
Consectetur adipiscing elit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum...
Read more . . .
LOREM IPSUM DOLORLorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in scelerisque eu, aliquet mattis tellus.
Consectetur adipiscing elit nisi non lorem sodales id euismod purus auctor. Quisque vitae mauris odio. Integer condimentum erat sit amet justo commodo vel interdum odio elementum...
Read more . . .
LOREM IPSUM DOLOR
Ut suscipit nisi sit amet, consectetur adipiscing elit. In dui tellus, tincidunt in sceler-isque eu, aliquet mattis tellus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In dui tellus, tincidunt. Vivamus tincidunt vehicula justo ac viverra.
Read more . . .
LATEST NEWSMYNAMEIS J.
scroll it
MYNAMEIS J.
la conception - Le site web
SIGN UP FOR EMAILS SUBSCRIBE
Mentions légales et crédits : Blablablablabla - 2013
VIMEO YOUTUBE BANDCAMP
MUSIC FILM NEWS CONTACT SITEMAP
Nec sane haec sola pernicies orientem diversis cladibus adfligebat. Namque et Isauri, quibus est usitatum saepe pacari saepeque inopinis excursibus cuncta miscere, ex latrociniis occultis et raris, alente inpunitate adulescentem in peius audaciam ad bella gravia proruperunt, diu quidem perduelles spiritus inrequietis motibus erigentes, hac tamen indignitate perciti vehementer, ut iactitabant, quod eorum capiti quidam consortes apud Iconium Pisidiae oppidum in amphitheatrali spectaculo feris praedatricibus.
NAMQUE ET ISAURI
download the night for free here.
MYNAMEIS J.
CONTACT MUSIC FILM
plateforme d’écoute et de téléchargement
la conception - Le site web
page de lecture du court-métrage
SIGN UP FOR EMAILS SUBSCRIBE
FACEBOOK VIMEO YOUTUBE BANDCAMP
MUSIC FILM NEWS CONTACT SITEMAP
Nec sane haec sola pernicies orientem diversis cladibus adfligebat. Namque et Isauri, quibus est usitatum saepe pacari saepeque inopinis excursibus cuncta miscere, ex latrociniis occultis et raris, alente inpunitate adulescentem in peius audaciam ad bella gravia proruperunt, diu quidem perduelles spiritus inrequietis motibus erigentes, hac tamen indignitate perciti vehementer, ut iactitabant, quod eorum capiti quidam consortes apud Iconium Pisidiae oppidum in amphitheatrali spectaculo feris praedatricibus.
DIU QUIDEM PERDUELLES Praedatricibus obiecti sunt praeter morem. Nec sane haec sola pernicies orientem diversis cladibus adfligebat. Namque et Isauri, quibus est usitatum saepe pacari saepeque inopinis excursibus cuncta miscere, ex latrociniis occultis et raris, alente inpunitate adulescentem in peius audaciam ad bella gravia proruperunt, diu quidem perduelles spiritus inrequietis motibus erigentes, hac tamen indignitate perciti vehementer, ut iactitabant, quod eorum capiti quidam consortes apud Iconium Pisidiae oppidum in amphitheatrali spectaculo feris praedatricibus obiecti sunt praeter morem.
NAMQUE ET ISAURI
MUSIC CONTACTFILM
MYNAMEIS J.
gallery
les aspects techniques - les choix
BESOINS
b publicationb administration
AvANTAGES
b gratuitéb simplicitéb personnalisationb communauté importante
ACCESSIBILITÉ& COMPATIBILITÉ
b HTML 5 & CSS 3
b Javascript (jQuery)
b responsive design
b API YouTube
b Vimeo
les aspects techniques - les choix
www.mynameisj.com
les aspects techniques - démonstration