[CS3] - Schreibtisch-Webseiten-Design wie Umsetzen.

[wers1]

Hallo,
ich wollte eine Webseite im Schreibtisch-Design erstellen. (ähnlich dieser: Columbus Ohio Commercials, Web and Print Development, Dann Whittaker Creative)

Nun habe ich meinen Schreibtisch mehrmals mit allen möglichen späteren Mouseovers und so fotografiert (Semi-Profi Kamera, gleicher Zoom, Autofocus aus) und wollte nun erstmal die Mouseover über die Normalen Bilder legen. Dabei fiel mir auf, dass trotz runtergelassener Rollos sich das Bild veränderte und somit für einen Mouseover samt Hintergrund nciht geeignet ist.

Nun Frage ich mcih wie ich das umgehen könnte. Da ich Photoshop einsteiger bin, mir aber alles, step-by-step, erarbeiten möchte, würde es mich freuen wenn ihr mir einen Ansatz (gern mit Tutorials) geben könntet wie ich am besten an die Sache rangehe.

Danke im Vorraus

Felix

 

[SchimpansenMann]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

Hey,

sinvoller wäre es, du würdest die einzelnen Elemente einzeln fotografieren und dann später in Photoshop zusammenführen. So kannst du die enzelnen Elemente besser ausleuchten und Dinge die sich nicht verändern (z.B. der Tisch) brauchst du nur in einer Version.
Andere mousover effekte kannst du dann auch direkt in Photoshop erstellen, wenn sich ein Element z.b. nur verschiebt oder größer wird. Dann fällt auch hier das Problem mit unterschiedlichen Versionen des Objekts (andere Belichtung) weg.


SchimpansenMann

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

da hast du wohl recht, nur genau da liegt das problem. die meisten objekte sollen sich komplett verändern. z.B. soll der Geldstapel in der Ecke zu einem turm gebaut werden, das Notizbuch (wenn auch nur als link) aufgeschlagen werden (wird auch noch größer gemacht wenn dieses Foto zur umsetzung kommen sollte), die werkzeuge geordnet werden,...

Damit ihr wisst wovon ich rede hier meine Schreibtisch Aufname. (die grünen Bildschirme werden natürlich noch ausgefüllt und auf die große leere flache wird nachträglich ein komplett mit photoshop erstelltes Blatt Papier kommen, außerdem sollen diverso post-its dazukommen)

 

[seecretum]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

Ich würds in Flash machen, da sparst du dir einigen Ärger mit den Webstandarts... die bei sowas nervig sind, und da die Startseite in Schreibtischform sowieso kein gscheides Ranking zulässt, kannst du es erst recht mit Flash machen!

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

naja, mag sein. nur fehlen mir da ein paar Kenntnisse und ich glaube das es bissl länger dauert sich in sowas einzuarbeiten.

Bei der Umsetzung wenn das Design steht habe ich an 2 Möglichkeiten gedacht:

- entweder eben normal und gut planen
- oder per svg. lässt auch viele Formen zu und ich denke wenn es funzt komme cih damit am besten. muss nur gucken ob das mit den hovern geht.



nur wichtiger ist mir erstmal ein ordentliches design hinzubekommen, vorher brauch ich mir ja noch gar keinen stress um die umsetzung im Web zu machen.

 

[ragazzastupida]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

Für dieses Vorhaben würde ich Dir auch empfehlen, in Flash zu arbeiten.
Rollovers sind teilweise recht ruckelig, besonders wenn sich die Form verändern soll.
ragazzaS

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

okay okay, ich guck mal was sich in flash machen lässt.

aber: meine eigentliuche frage war ja wie ich erstmal das Design hinbekomme und nicht die Umsetzung im Web. Wäre nett wenn ihr mir dazu noch ein paar tipps geben könntet.

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

sry, muss es nochmal hochposten, die frage beschäftigt mich wie wild...

 

[xTomY_CraphicSx]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

ich würde sowas auch gern können so ein design ist richtig geil könnt ich gebrauchen wen mir jemand helfen will PN bitte danke

 

[ragazzastupida]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

sry, muss es nochmal hochposten, die frage beschäftigt mich wie wild...

Ich würde Dir gerne helfen, wenn ich eine brauchbare Idee hätte. Dein Schreibtisch und der von der Webseite haben so gar nichts gemeinsam.
Deine Farben sind recht grell, da gilt es erst einmal, Stimmung zu erzeugen. Den lästigen Monitor würde ich weglassen, und nicht zu viele rollover-features einbauen. Versuch doch erst mal, Deinen Schreibtisch ansehnlich in Szene zu setzen und ihn dann vollzupacken.
ragazzaS

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

naja, ich hatte mir so eine Entdecker-Seite vorgestellt. Es sollten viele verschiedene Effekte da sein. Zum Teil aus Spaß zum Teil mit sinn. Bsp: Bildschirm: Eine meiner Referenz Seiten - Klick - Referenzen. Notizblock - klick - aufschlagen, Über mich; Werkzeuge: Tools;...
Weiß nicht, stelle mir das ncih so nervig vor wenn die Hovers vorgeladen werden bzw. vllt find ich auch was in flash oder so dass die nich so schroff übergehn.

Neben allem soll man ja auch noch über einen Zettel der nachträglich im Rand eingeblendet wird und dem Menü unter der gesamten seite die Seiten schneller ansteuern können, sodass man sich das nich immer antun muss, wer aber lsut drauf hat auf entdeckugsreise zu gehn kann das machen.

Weiß nich ob ich da grade total falsch denke, wenn ja sagts mir bitte

aber mit dem bildschirm hast du wohl recht. mir is grade eingefalln dass ich mit dieser schrägstellung, vergessen kann mit normalen zeichen in das buch zu schreiben.

 

[mondspeer]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

Ja, ich würde entweder den Schreibtisch aufräumen und mit gutem Licht von oben fotografieren oder aber die einzelnen Objekte in der jeweils gleichen Lage und mit gleichem Licht vor schwarzem Hintergrund ablichten.

Dann in Flash (oder PS) zusammen montieren.

Es stimmt aber, dass solche Seiten nicht gut bei den Suchmaschinen ankommen, es sei denn, Du schaffst es, trotzdem den Quelltext klar zu erstellen und die Bilder über css zu ersetzen (Es gibt ein gutes Buch zu dem Thema: "Bulletproof Webdesign" oder so ähnlich.)

 

[The_Doomed]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

noch ein paar tipps von mir
ich würde dir ebenfalls empfehlen die objekte einzeln zu fotografieren (notfalls aus dem gesamtbild ausschneiden) da sich dann in ebenen im Photoshop oder flash wesentlich besser arbeiten lässt
und beim fotografieren unbedingt den Arbeitsplatz gut ausleuchten und auf
Blitz verzichten
am besten wäre für so ein Projekt ein Stativ mit fernauslöser da die kamera dann fixiert wäre
Überlagerungsbilder aus der Hand zu fotografieren ist unmöglich ^^

MfG

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

okay klingt gut. werde mit css mein bestes geben um nen sauberen quelltext zu schaffen. aber die fotos sind schon das problem.

Auslauchten habe zwar gute taschenlampen, aber da muss ich erstmal sehn wie cih die festmachen kann.
Fernauslöser nein
stativ ja, nur glaube ich dass ich den senkrechten stab des stativs mit-fotografieren wenn ich damit nach unten fotografiere. hat jemand ne idee wie ich das umgehen kann?

 

[smaxle]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

hier mal ein Schreibtisch in Flash:

Personal page Easy flash templates - At www.flashtemplatestore.com

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

danke, schaut nich schlecht aus. funkelt mir aber bissl zu sehr. bei mir soll, solange der nutzer nix macht, sich auch nix bewegen.

werde jetzt mal probieren alles draußen vor nem blue-screen zu fotografieren und alles dann auf ne holztextur, mit schlagschatten auf den objekten, einzufügen.

 

[smaxle]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

da hab ich noch ein Tutorial gefunden:

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

super. besten dank. das wird mir sicher noch etwas helfen.

 

[seecretum]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

Ich weiss garnicht was alle immer haben... flash ist nicht schwer! Da kannst du vor allem alles Umsetzen! Schau dir das mal an, mehr brauchst fast nicht wissen http://tv.adobe.com/de/#vi+f15246v1023 auch wenn du alle Videos von der Seite anschaust hast du die Grundlagen!

 

[wers1]

AW: Schreibtisch-Webseiten-Design wie Umsetzen.

okay, werde mich mal durchkämpfen. hoffentlich is es nich so unterschiedlich zu meinem flash MX