faitmain / faitmain.org

Le magazine faitmain.org
27 stars 23 forks source link

Identité visuelle #32

Open raphaelbastide opened 11 years ago

raphaelbastide commented 11 years ago

Fait suite à cette discussion

Effectivement, Lobster est considérée comme une fonte du web 2.0 utilisée très souvent par des sites amateurs. Ce n'est pas un problème en soit le choix typographique et de son utilisation a un impact direct sur l'identité du site et l'image que l'on en a lors de sa première visite. En réalité, j'ai un peu peur que les points suivants vieillissent mal avec le temps :

Posent aussi problème :

Le reste semble tout à fait correct :

Aussi je pense qu'il y a une légère confusion entre le logo (pour l'instant en Lobster) et les titres (en Lobster aussi). Il serait plus clair d'utiliser deux fontes séparées pour l'identité et le contenu, ou bien la même mais moins décorative.

Ce ne sont là que des conseils, encore une fois, le site actuel fonctionne bien et pourrait rester tel quel. Seulement pour nous graphistes, certains détails font un peu tiquer parce que nous sommes dans le métier :D

J'aiderai avec plaisir dès que j'aurais plus de temps.

Inspiration web design et typographie Against Lobster font abuse

alcoralcor commented 11 years ago

Je soutiens ces remarques. Et particulièrement la largeur trop importante par défaut. Il faut y ajouter un travail sur la version PDF et sur le futur ePub. @raphaelbastide tu aurais des propositions à faire graphiquement ?

raphaelbastide commented 11 years ago

@alcoralcor Oui, j'en aurais mais c'est le temps qui me manque en ce moment.

tarekziade commented 11 years ago

Merci @raphaelbastide pour les retours

Bon j'ai changé la font des headers déja - je vais retoucher les autres élèments au fur et a mesure

ce qui faudrait aussi c'est un vrai logo je crois. je verrais bien une figure de type "patent"

genre: http://0.tqn.com/d/inventors/1/0/C/V/handpatent.gif

raphaelbastide commented 11 years ago

C'est beaucoup mieux avec cette fonte sur les headers, plus fonctionnel en tout cas. Logo, oui, c'est une bonne piste, bonne car intemporelle et qui raconte quelque chose. Il serait intéressant de l'associer à la préhension par exemple

Même le style typographique utilisé pour "Fig1" est manuaire mais sans cliché, ça peut être une bonne piste pour le logo. Le tout dessiné avec Inkscape, bien sûr ! je vais essayer de prendre du temps pour vous faire une proposition.

tarekziade commented 11 years ago

Ah cool c'est sympa!

raphaelbastide commented 11 years ago

Pouvez-vous me lister toutes les applications de ce logo (mag papier, pp twitter…) ; la cible du mag, et ce que les visiteurs doivent avoir comme impression en voyant ce logo ? Cela m'aidera à développer un travail d'identité.

tarekziade commented 11 years ago

ok

la cible c'est les geeks qui s'interessent aux DIY - le fil directeur c'est le mélange des genres: je vais découvire l'art digital ou la photo culinaire grace a des articles qui sont un peu a cheval sur mon domaine (informatique etc..)

L'impression que (moi en tout cas) j'ai envie de donner est de comprendre tout de suite que c'est un magazine DYI accessible a tout le monde - meme si certains sujets sont pointus.

almet commented 11 years ago

J'aime beaucoup cette idée de logo.

Pour la cible du magazine, je pense qu'on peux cibler les non-geeks également; les personnes qui aiment bien faire les trucs eux même; et qui sont curieux, suffisamment pour entendre parler de technologie par exemple. Mais des photographes ou des cuistots qui veulent en savoir plus sur la frontière electronique / bouffe sont tout autant une cible non ?

tarekziade commented 11 years ago

oui, oui - c'est ma définition du geek en fait, je le cantonne pas uniquement a l'informatique - peut etre "bidoullleur" ? mais ca semble un peu péjoratif non ?

almet commented 11 years ago

"bidouilleur" n'est pas péjoratif pour moi, c'est la traduction de hacker non? "bricoleur" peut être sinon ? Le coté "non pro" est important à mon avis.

tarekziade commented 11 years ago

Ma génération c'était péjoratif - un bidouilleur c'etait qqun qui faisait du code de merde :)

Mais ca a peut etre changé

alcoralcor commented 11 years ago

Cool l'idée. Mais le logo perdra de sa force dans recharter le site en même temps. Il serait peut-être bien de réfléchir une charte suffisamment avancée avant de toucher au site, sans quoi le lecteur va finir par tomber malade s'il y a des changements trop fréquents. Une sorte de sprint là dessus pourrait être efficace ?

raphaelbastide commented 11 years ago

J'ai bien réfléchis et je suis sur une piste assez complète comprenant effectivement une solution graphique plus large que simplement un logo. Elle va jusqu'à une "application" spécifique et manuelle du systèmle identitaire ; une vraie solution design.

Avant de vous montrer quoi que ce soit, j'aimerai vous poser quelques questions :

tarekziade commented 11 years ago

Dans quelle mesure pouvez-vous changer l'identité actuelle ?

Le #2 se construit ici: http://next.faitmain.org. On peut changer tout. Pour moi la seule chose tres importante est de garder la clarté de lecture avec du responsive design.

Le magazine actuellement en PDF sera-t-il imprimé un jour ?

C'est un souhait à long terme. Avec une meilleure mise en page, probablement avec Scribus et si possible automatiquement.

J'ai commencé a ajoute ce qu'il fallait (des marqueurs pdf/nopdf )

Possédez-vous un budjet, même mini pour des "goodies" ?

Qu'entends tu par 'goodies' ? tu as une idée précise en tete ?

Peut-on avoir quelques chiffres sur les visites du sites et les éventuels plans à venir pour le projet ?

a la sortie on était a 10000 visites /jours, c'est descendu entre 1000 et 2000 / jour.

Mon plan pour la suite, est de lancer une association avec des evenements DIY a la villette et ailleurs, et de mettre en place un comité de rédaction etc. Mais le magazine a clairement une niche qui interesse bcp de monde

raphaelbastide commented 11 years ago

Qu'entends tu par 'goodies' ? tu as une idée précise en tete ?

Oui, je pensais mettre en place un système de sticker sur des couverture physiques pour le titre des revues et leurs numéros. les stickers seraient imprimés en masse et remplis à la main pour le numéreau du mag. Côté web, un "badge" en CSS absolute pourrait être draggé (déplacé) et faire directement référence à ce sticker. Pour les pdf lecture écran, on pourrait envisager un placement aléatoire (ou manuel mais différent à chaque fois) de ce genre de module graphique. L'idée est de séparer l'impression, la publication web et les revues en pdf de l'identité globale qui est elle rajoutée au contenu, comme un élément graphique collé "à la main" sur le contenu. Je prépare quelques images…

tarekziade commented 11 years ago

Sympa comme idée. Pour les stickers j'aime bcp le rendu de http://www.stickermule.com/ ils sont chers car en vinyl, mais on devrait pouvoir trouver un fournisseur en France

Je vais avoir un peu plus de temps d'ici quelques jours pour rebosser le PDF, le site etc.

raphaelbastide commented 11 years ago

Voilà quelques recherches préliminaires : j’insiste, ce ne sont que des idées de systèmes, les typos, couleurs et grilles ne sont pas encore choisies.

1

3

2

raphaelbastide commented 11 years ago

Il est aussi envisageable de passer sur une couverture avec des formes géométriques (génératives?) étant donné la diversité des photos et leurs qualité. Je suis aussi en train de travailler sur un logotype utilisable sur les réseaux sociaux qui représenterai les lettres FM dans un dessin typographique rappelant une empreintes digitales.

tarekziade commented 11 years ago

génial !! pour le coté génératif pas de soucis, on peut brancher ca dans le générateur de PDF - je peux m'occuper de la partie coding - dis moi quoi faire exactement et je le rajoute - je te rajoute aussi dans le compte github

+1 pour l'idee de logo twitter

raphaelbastide commented 11 years ago

Ok ça roule mais ça nécessite encore un peu de taff de mon côté. Aussi je penses qu'il faudrait pouvoir détecter sur les pdf les zones blanches et les zones occupées par une image afin de placer la pastille à cheval sur les 2 zones (voir mes démos). Les questions qui se posent :

Je vous tiens au courant de mes avancées assez rapidement. Pas la peine de développer quoi que ce soit, je pense que c'est encore un peu tôt. Tests needed.

tarekziade commented 11 years ago

A+

raphaelbastide commented 11 years ago

Voilà de nouvelles recherches graphiques. J'ai fait le choix d'un caractère dessiné par mes soins, basé sur une structure stricte en pixel qui possède néanmoins des caractères de manuaire. Les couleurs ne sont pas trop nombreuses pour qu'elles restent reconnaissable, elle seront utilisées de manière exclusive, c'est à dire une par une, pas les 4 ensembles. Le caractère d'accompagnement a empattements est pour l'instant Linux Libertine Display. Il contraste avec celui du logo, et permettra d'être repris pour le corps des articles par exemple. Ce choix n'est pas encore affirmé et peut changer mais la volonté est là.

Le typogramme

Utilisé sur tous les supports imprimés, web ou PDF — Voir en PDF

g3360

Le signe

Utilisé comme avatar, modulé sur plusieurs couleurs — Voir en PDF

avatar

tarekziade commented 11 years ago

Tres tres cool!

pour la suite je pense qu'il faut qu'on decoupe le travail en plusieurs phases,

1/ integration site web uniquement - avec un objectif deadline pour le numero #2 (1 mai) 2/ le PDF 3/ partie impression

comme ca on peut prendre le temps de travailler sur 2/ et 3/ (voir de peaufiner 1/)

De mon coté il faut que je booste le contenu pour le #2 sur les prochaines semaines, je suis a la bourre

raphaelbastide commented 11 years ago

Un premier test pour le site web : J'ai essayé de globalement conserver le template. Ces maquettes ne doivent pas être utilisées pour l"intégration, rien n'est réglé, ce sont simplement des maquettes d'idées. NB les détails en background.

website

tarekziade commented 11 years ago

<3

raphaelbastide commented 11 years ago

Pour la suite j'attends un planning Tarek. Source des logos clean, maquettes web à intégrer propres, concept plus clair sur l'identité du magazine… Dit-moi pour quand tu aimerais tout ça.

tarekziade commented 11 years ago

asap ;)

La sortie est le 1 mai et il y aura un gros coup de rush entre le 15 avril et le 1 mai - donc à toi de voir si tu peux livrer avant le 15 avril pour qu'on intègre. L'intégration technique devrait etre très rapide.

Si c'est pas possible pour cette date on pourra le faire pour le 3eme.

raphaelbastide commented 11 years ago

C'est sans doute jouable pour moi. J'ouvre une issue pour les maquettes. https://github.com/faitmain/faitmain.org/issues/46