Aide design site Architecture

Aide design site Architecture - Web design - Graphisme

Marsh Posté le 01-08-2010 à 21:29:41    

Bonjour à tous,  
 
je viens de finir mes 3 premières années d'archi, et je voudrais créer un site web dans lequel je placerais mes projets, mes travaux ...
Je cherche donc ici de l'aide pour le design de celui-ci. Je cherche quelque-chose d'assez sobre et épuré, mais dans un style archi.
J'avais déja réaliser un site il y a environ 6 mois dont je ne suis pas vraiment satisfait.
Voici le liens pour que vous puissiez voir +/- la structure du site:
http://horta.ulb.ac.be/studentpubl [...] /bac2.html
 
Je cherche donc a changer complètement de style dans des ton plus gris / bleu plus lumineux et moins "sinistre"
voici un exemple que j'ai pas mal apprécié:


Je ne sais pas du tout par où commencer, je suis un peu perdu.
Je vous remercie d'avance pour votre aide.
 
PS: je suis un peu dans la merde, car j'en aurais besoin très vite pour postuler pour des stages...

Reply

Marsh Posté le 01-08-2010 à 21:29:41   

Reply

Marsh Posté le 02-08-2010 à 13:34:08    

est-ce que quelqu'un pourrait m'aider, parce qu'il me reste environ 1 semaine pour terminer mon site web. Sinon je suis  vraiment dans la m**** :(
Donc si vous avez des idées de design ou quoi que ce soit qui pourrait m'aider, je vous écoute.

Reply

Marsh Posté le 02-08-2010 à 18:09:35    

bin dur à dire, mais moi je trouve ça super chargé en tout cas en l'état. Mais sinon c'est pas forcément dégeu, même si je trouve ça très corporate (c'est voulu?)

 

EDIT: j'avais mal suivit, c'est pas de toi :D
bin franchement, désolé mais je peux pas t'aider, on va pas faire la recherche de ref pour toi :)


Message édité par wizopunker le 02-08-2010 à 18:10:35

---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Reply

Marsh Posté le 02-08-2010 à 21:34:24    

nico2302 a écrit :

est-ce que quelqu'un pourrait m'aider, parce qu'il me reste environ 1 semaine pour terminer mon site web. Sinon je suis  vraiment dans la m**** :(
Donc si vous avez des idées de design ou quoi que ce soit qui pourrait m'aider, je vous écoute.


Salut,
Tu t'y prends un peu trop tard :spamafote:
 
Le dernier site est assez récent si je me souviens bien en plus. Garde le en attendant, il est de facture honnete pour quelqu'un un archi je pense ;) (tu sera jugé sur tes créa d'archi pas sur ton site)


---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR
Reply

Marsh Posté le 03-08-2010 à 10:08:43    

Ce n'est pas dramatique si je n'ai pas terminer mon nouveau site web pour dans une semaine, mais comme cette semaine, je n'ai pas grand chose à faire, j'en profite pour commencer.
J'ai commencer à réaliser mon nouveau design sur PS.
 
Voici un aperçu:
http://img197.imageshack.us/img197/6199/designsiteweb.jpg
 
Le contenu serait placé dans le cadre rouge, alors que le reste serait fixe.
 
http://img52.imageshack.us/img52/5403/designsiteweb2.jpg
 
Je ne sais pas encore comment le mettre en oeuvre.
Je ne sais pas si je le réalise sous la forme d'une colonne centrée (comme la plupart des site web)
ou sous la forme d'un cadre fixe. Dans ce cas, le contenu serait placé dans le cadre rouge et défilerait.
Le mieux serait que l'image prennent 100 % de la largeur de l'écran, mais je ne sais pas si c'est possible.
Je ne sais pas si je suis bien clair...
 
Qu'en pensez vous?
 

Reply

Marsh Posté le 03-08-2010 à 10:11:23    

dur de répondre vu qu'on sait pas où tu veux mettre du texte. Mais à priori ça semble faisable avec juste un fond et des div transparents dessus :D


---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Reply

Marsh Posté le 03-08-2010 à 10:36:44    

Ce qui a c'est que je ne sais pas si je fais un site sous la forme  
  - d'une colonne centrale (comme la plupart des site), mais dans ce cas, je ne sais pas comment faire pour continuer le fond plus bas
  - d'un cadre de ... px sur ... px centré au milieu de l'écran.
  - ou alors dire que la page prennent 100 % de la largeur. (dans ce cas, je ne sais pas du tout comment m'y prendre)

Reply

Marsh Posté le 03-08-2010 à 10:42:02    

bin c'est à toi de voir.
Déjà pour les histoires de 100%, avec ce genre de visuels, ça me semble tendu :D
A mon sens, la colonne centrale à une forte connotation blog, et ça marche bien si le contenu est régulièrement mis à jour. Et le cadre centré, ça marche bien pour des sites qui n'ont pas trop de contenu (et où il n'y a donc pas beaucoup à scroller).
 
Après il faut voir :D


---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Reply

Marsh Posté le 03-08-2010 à 10:54:45    

Bon je vais laisser tomber l'histoire des 100 %
J'ai peur que je sois un peu à l'étroit avec un cadre centré au milieu de l'écran, mais dans le cas de la colonnes centrale, je ne sais pas trop comment faire pour continuer le design vers le bas ? (vu que le fond est une image difficile à répéter ou a continuer)
Tu as une idée?

Reply

Marsh Posté le 03-08-2010 à 23:25:07    

bah moi je préfère largement le premier, que je trouve nickel (à part le code  :whistle: )

Reply

Marsh Posté le 03-08-2010 à 23:25:07   

Reply

Marsh Posté le 04-08-2010 à 06:44:29    

Salut Nico !
Je suis architecte et je viens de faire mon premier site web-portfolio.
Je l'ai fait en 6 jours seulement : 50h de travail environ ...
Bon il est simple, mais je pense assez efficace ...  
Tout est fait sous photoshop, puis exporter sous Dreamweaver ... un jeu d'enfant :)
 
http://www.n-architect.com/
 
Bon courage ! :)

Reply

Marsh Posté le 04-08-2010 à 09:40:29    

il est juste imbitable au niveau du code :D


---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Reply

Marsh Posté le 04-08-2010 à 12:37:37    

uais le copié/coller d'image ne fait pas un site internet désolé ^^

Reply

Marsh Posté le 04-08-2010 à 13:01:22    

Au lieu de faire des reproches inutiles, tu ne pourrais pas dire quelque chose de constructif ?  
 
Je ne suis pas infographiste et cherche donc de l'aide pour la réalisation de mon portfolio.


Message édité par nico2302 le 04-08-2010 à 13:02:25
Reply

Marsh Posté le 04-08-2010 à 16:33:32    

voici l'état d'avancement de mon portfolio :
Je n'ai pas encore placer le contenu, mais c'est pour ce faire une petite idée.
 
http://users5.nofeehost.com/nico2302/test/index.html
 
Qu'en pensez-vous?
Avez-vous des conseils ou des suggestions niveau organisation et design


Message édité par nico2302 le 06-08-2010 à 14:48:24
Reply

Marsh Posté le 06-08-2010 à 14:48:37    

up
 
Je l'ai encore un peu modifier (surtout au niveau du code)


Message édité par nico2302 le 06-08-2010 à 14:53:58
Reply

Marsh Posté le 06-08-2010 à 22:27:18    

vu que t'as posté un sujet identique sur la cat prog autant parler de code là-bas et concentrer ici les remarques/questions sur le design ;)


---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR
Reply

Marsh Posté le 07-08-2010 à 00:37:37    

c'est justement pour cela que je suis ici.
J'ai dit que j'ai changé le code, qui a donc influencé un peu le design.
Mais de toute  façon, je n'ai pas encore u de conseils ou d'opinions de la part de webdesigners.
 
Allez-y vous pouvez y allez, mais si c'est négatif

Reply

Marsh Posté le 07-08-2010 à 11:55:14    

Bin la qualité des images est vraiment dégueu déjà, ça fait pas pro du tout, en terme de compression j'entends.
Ensuite j'aime bien le machin qui suit la sélection du menu, c'est pas mal du tout comme idée je trouve. Par contre les menus en eux-même, je les trouve un peu trop grossier aussi. Pareil pour les contours de tes div.

 

Et pour finir, je trouve ça super désagréable d'avoir deux barres de scroll (celle de la fenêtre, et celle de ton overflow). Je suis sur une résolution de 1280 x 800.

 

Et sur l'aspect visuel, le fond gris mériterait au moins un petit dégradé :D

Message cité 1 fois
Message édité par wizopunker le 07-08-2010 à 11:55:22

---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Reply

Marsh Posté le 07-08-2010 à 12:40:35    

Nico je ne parlais pas de toi, mais de nibooworld qui postait un "exemple" ( j'aurai du le quoté.. sry :) )
 
Sinon pour ton design, je trouve que l'ensemble est trop pale et mal organisé. Tu as voulu faire comme l'exemple "architecte exemple" qui est vraiment bon mais ce que tu as fait c'est un mélange de Grunge et de Grid, et ça choque.
 
Quand on fait un design en Grid il faut surtout utiliser son CSS pour la découpe, tien un générateur de template en grid: http://960.gs/
 
Par exemple le fond du contenu doit etre d'une couleur uni ou alors un dégradé leger
Mettre un batiments architectural en fond de ton nom/logo seulement  
Ta couleur dominante n'est pas bonne car trop pale peut etre choisir quelque chose de plus simple comme du blanc ou un blanc gris.


Message édité par Profil supprimé le 07-08-2010 à 13:14:53
Reply

Marsh Posté le 07-08-2010 à 12:57:38    

wizopunker a écrit :

Bin la qualité des images est vraiment dégueu déjà, ça fait pas pro du tout, en terme de compression j'entends.
Ensuite j'aime bien le machin qui suit la sélection du menu, c'est pas mal du tout comme idée je trouve. Par contre les menus en eux-même, je les trouve un peu trop grossier aussi. Pareil pour les contours de tes div.
 
Et pour finir, je trouve ça super désagréable d'avoir deux barres de scroll (celle de la fenêtre, et celle de ton overflow). Je suis sur une résolution de 1280 x 800.  
 
Et sur l'aspect visuel, le fond gris mériterait au moins un petit dégradé :D


 
Merci, au moins avec ça je vai pouvoir avancer.
 

  • les menus grossier: je cherche quelque chose de sobre donc je vais au moins essayer de changer la police et peut-être de mettre un gris à la place du noir
  • Pour les contour des div, c'est provisoire, je vais essayer de mettre un ombrage, mais bon, je ne voudrais pas non plus que le site devienne trop lourd.
  • Pour la double barre de scroll, peut-être que le cadre fixe de 1000 px de large sur +/- 680px de haut est trop grand. C'est parce que je travaille sur une résolution de 1980*1200, donc sur mon écran, cela parait petit. Quelle résolution devrais-je adopter pour un cadre fixe. Cela pourrait également résoudre le problème de qualité d'image?
  • Pour le dégradé du fond gris, je vais tester.


Reply

Marsh Posté le 07-08-2010 à 13:20:04    

Pour un cadre fixe, tu peux utiliser des % au lieu des pixels pour la taille de ta hauteur et largeur. (à tester)

Reply

Marsh Posté le 07-08-2010 à 13:26:21    

Citation :

trop pale et mal organisé:


Pour le moment, il n'y a encore aucun contenu, et je voudrais que le reste du site soit sobre.
Et pourquoi dis tu que c'est mal organisé?
 

Citation :

fond du contenu doit être d'une couleur unie ou un dégradé léger:


est-ce que tu as un exemple, parce que pour le moment le site est vide, donc le fond ressort beaucoup, mais quand je l'aurai rempli, je ne suis pas sur que le fond ressorte tant.
En gros, je devrai inverer et mettre une image derrière mon "logo" et le reste uni ou dégradé?
 

Citation :

Ta couleur dominante n'est pas bonne car trop pale peut etre choisir quelque chose de plus simple comme du blanc ou un blanc gris.


Je suis daltonien, donc les couleurs je ne gère pas trop :) Mais j'ai essayer de faire quelque chose dans les ton gris.
 
_________________________________________________________________
 
Donc, si je récapitule

  • image de mauvaise qualité.
  • Ne pas mettre d'image en fond de contenu
  • Le gris de fond devrait avoir un petit dégradé
  • Menu grossier
  • encadrement de div
  • 1000px/680px => résolution trop grande pour certain écran / essaer d'utiliser des % (je risque vraiment de galérer avec ça)


J'ai du boulot alors :D


Message édité par nico2302 le 07-08-2010 à 13:34:57
Reply

Marsh Posté le 07-08-2010 à 13:43:34    


Ha oui encore un truc, est-ce que vous connaissez des exemple de site ou d'images... desquelles je pourrais m'inspirer. Parce que j'ai pas mal  chercher, et je suis un peu perdu. par exemple si vous connaissez de chouette site aussi avec un cadre fixe, ou un dans le même genre ou dans les même ton.


Message édité par nico2302 le 07-08-2010 à 13:44:04
Reply

Marsh Posté le 07-08-2010 à 14:06:02    

c'est dangereux ça, un architecte daltonien ? (joke^^)
 
Sinon une petite liste de magnifiques sites d'agences d'architecture ou d'architecte, ça peut te donner un peu d'inspiration:
 
http://www.zoomstudio.org/
http://www.dcpparquitectos.com/
http://work.ac/
http://www.snoarc.no/#/main/
http://wonder-wall.com/#project/en
http://www.maddoxassociates.co.uk/
http://www.mac-interactive.com/#
http://xtenarchitecture.com/
 
 
tout à l'heure je t'envoi une image avec les corrections que je verrai, ce qui ne veut pas dire que c'est comme cela que tu dois faire.. mais juste une idée d'orientation ;)

Reply

Marsh Posté le 07-08-2010 à 19:25:47    

ça c'est vraiment sympa merci beaucoup :)

Reply

Marsh Posté le 08-08-2010 à 14:38:01    

par ici: http://img594.imageshack.us/img594 [...] tecte4.jpg
 
C'est un peu plus sombre que ce que tu as fait, mais ça joue sur le clair-obscur :)
Ca reste trés minimaliste comme la plupart des sites d'architecte.


Message édité par Profil supprimé le 08-08-2010 à 14:39:13
Reply

Marsh Posté le 08-08-2010 à 14:45:03    

c'est vraiment sympa merci :) c'est pas mal ton idée de jouer sur mes clair obscur
est-ce que tu pourrait me passer le lien de l'image de fond s'il te plait?

Reply

Marsh Posté le 08-08-2010 à 14:56:39    

Reply

Marsh Posté le 08-08-2010 à 15:01:19    

merci :) je vais essayer de faire quelque chose de bien alors.
Est-ce que tu crois que je dois laisser tomber l'idée de la grande barre verticale qui se déplace avec le menu?

Reply

Marsh Posté le 08-08-2010 à 15:21:47    

Si t'as du mal avec le graphisme j'ai peur que cela ne rende bien pas visuellement. Le mieux est de faire au plus simple et mettre en avant tes projets et compétences :)
 
Après si tu te sens de le faire avec un bandeau vertical animé qui bouge en fonction du menu alors fonce, faut voir le rendu final ^^

Reply

Marsh Posté le 08-08-2010 à 15:42:31    

En fait ce qui est dur avec ce bandeau c'est d'articuler le contenu autour.
je vai faire des test.


Message édité par nico2302 le 08-08-2010 à 18:30:24
Reply

Marsh Posté le 08-08-2010 à 19:11:21    

Voila, j'ai un peu continuer dans le style que aMonsterAndGirls proposait.
Finalement, j'ai préféré mettre un fond uni derrière le contenu, c'est plus clair
http://img199.imageshack.us/img199/7345/testws.jpg
Qu'en pensez vous? Que reste t-il comme problèmes?


Message édité par nico2302 le 08-08-2010 à 21:29:21
Reply

Marsh Posté le 08-08-2010 à 21:07:48    

Voici le dernier design.
Allez-y vous pouvez critiquer :) J'espère que j'arrive à quelque chose d'acceptable maintenant.

 

http://users5.nofeehost.com/nico2302/test2/index.html


Message édité par nico2302 le 08-08-2010 à 21:30:06
Reply

Marsh Posté le 11-08-2010 à 14:19:06    

bon voila, ou j'en suis.
Finalement, j'ai retirer l'image de fond qui faisait "concurrence" avec mes projet. Le site devenait un peut trop chargé.
Pour le moment, je le trouve trop peu contrasté.
 
Je voulais savoir ce que vous en pensiez?
http://users5.nofeehost.com/nico2302/test3/index.html

Reply

Marsh Posté le 11-08-2010 à 14:28:24    

Re :)
 
Bah, maintenant que tu connais un peu JS/Jquery, pourquoi pas intégrer les sous menu dans ton rectangle flottant...
Sinon, tu peux mettre un background semi transparent à ce rectangle, et donc le mettre au premier plan...


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 11-08-2010 à 14:31:22    

Oula, ton JS est un gros bordel, tu t'es pris la tete pour rien !!!


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 11-08-2010 à 14:48:28    

tu parle du code ou de l'effet rendu?

Reply

Marsh Posté le 11-08-2010 à 15:12:30    

du code...
L'effet est chouette, mais le code n'est pas du tout optimisé... Ça ne te gêne surement pas vu qu'il est fonctionnel, mais tu pouvais le simplifier grandement... On appel ça la factorisation du code...
Plutot que de faire 5 fonctions retournant la meme action à 5 élément différents, on va en faire qu'une...
Pourquoi tu as lacher le .JS que je t'avais fais pour le déplacement du rectangle ?


---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 11-08-2010 à 15:13:48    

sinon, je viens de tester un truc dans ce style la:
nicolas gustin
j'ai pas changer encore le background du rectangle flottant.
J'ai essayer de metre un background qui ressemble plus à un motif ou une texture qu'une image.

 

Qu'en penses-tu?


Message édité par nico2302 le 01-09-2010 à 11:48:57
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed