Anzeige

Tobiasdeml.com - WIP von Anfang bis Ende :-)

Tobiasdeml.com - WIP von Anfang bis Ende :-) | PSD-Tutorials.de

Erstellt von TobiasDeml, 27.11.2007.

  1. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    Hallo Leute,

    ich hab so gute Erfahrungen damals mit der Squench-Homepage in diesem Forum gemacht, deshalb mag ich hier auch meinen WIP-Fortschritt betreffend meine persönliche Portfolio-Seite zeigen.
    Teaser

    Bisschen was zum Konzept: Es soll eine Portfolio-HP werden, die ich jedem möglichen Kunden oder Studio in die Hand drücken kann, und wo der Arbeitgeber meine Arbeiten sehen kann (aus 3D, Fotografie und 2D).
    Da es eine persönliche Homepage ist, und ich als Produkt lediglich mich und meine Fähigkeiten verkaufen möchte, soll ein starker Bezug zu mir selbst da sein, der Kunde soll wissen, für wen er sich da interessiert.

    Folgendes Konzept: Eine einsame Couch - ein Chesterfield-Sofa, auf dem ich mich befinde - in einem beinahe leeren Raum, im Hintergrund eine zerrissene DDR-Tapete, und an der Wand ein glänzend-schwarzer "Screen", auf dem dann meine Arbeiten, Lebenslauf, Downloads oder was auch immer zu sehen sein werden, je nachdem, wo man gerade auf der Seite ist.

    Je nach Seitenposition habe ich etwas komplett anderes an und sitze, liege, stehe ... was auch immer, bei und auf der Couch.

    Ich bin mir noch nicht sicher, ob ich es per HTML oder per Flash unsetzen möchte, wobei ich Flash wegen der Möglichkeit, Bilder hin- und herfahren zu lassen, bevorzugen würde, aber kein Flash habe ;-)
    Wie siehts mit der Flash-Demo aus, kann man da speichern?


    S, und damit das ganze nicht so textlastig wird, hier eine Skizze:

    [​IMG]


    Keine Sorge, so hässlich wird die Seite nicht. Die Skizze zeigt bloß die Anordnung der Elemente, in etwa.


    Paar Fragen:

    1) wie stellt ihr euch die Navigation vor? Ich habe an Schachteln gedacht, die irgendwie reagieren, wenn man über sie hovert, gelinkt zu einer Leiste von Textlinks, wie ich es auf der Squench-Homepage gemacht habe. ( grms )

    2) Der Content kommt auf diese schwarze Fläche, die irgendwie nicht wirklich in dem Raum drinnen ist, sondern mehr "drüberliegt". Gute Idee, oder soll ich sie verwerfen?

    3) Wenn ich einen Boden mache (was ich wahrsch. tun werde), was soll der dann für eine Struktur haben? Ich habe an dunkelbraunes, spiegelndes Plankenparkett gedacht, ca so:
    [​IMG]


    Wenn euch noch was einfällt oder ihr etwas auf dieser Seite haben wollt, dann lasst es mich wissen :)


    Tobias
     
    Zuletzt bearbeitet: 27.11.2007
    #1      
  2. Tobbsn

    Tobbsn Nicht mehr ganz neu hier

    Dabei seit:
    17.10.2007
    Beiträge:
    216
    Geschlecht:
    männlich
    Ort:
    Augsburg
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    wow, erstmal dickes lob bzw.sogar schon fast bewunderung, echt nette sachen machst du.

    ich würde ebenfalls zu schachteln tendieren, aus dem du vll. immer anderster raus guggt bei hover und ein schild mit dem jeweiligen link name alos home, about usw trägst.

    für den boden würde auhc so dunkles laminat verwenden aber ich würde es in horizonteller (is das deutsch?) richtung nehmen also das muster un links nach rechts. außerdem würde ich den schwarzen bereich etwas verkleinern.

    gestallte den content doch so als ob du n rießieges, in einem alten großen holzrahmen befindlichen, Gemälde an der wand hängen hast.

    das wars ^^

    gruß

    tob
     
    #2      
  3. Foto-Delight

    Foto-Delight kleines Helferlein

    Dabei seit:
    21.11.2006
    Beiträge:
    542
    Geschlecht:
    männlich
    Software:
    Cs3, Terragen
    Kameratyp:
    D40x
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Ja also nach der beschreibung habe ich mir des auch komplett anders vorgestellt als dann auf dem Bild.

    Also für mich kams so rüber.

    Großer Leerer Raum wie bei Bruce-Allmächtig in der Szene mit Gott.
    Rechts ein Fenst mit Lichteinfall. An der Wand hinten ein LCD mit deinen Bilder und dann vorne ein Sofa. Mit dir beim faullenzen. Oder mal an ner Säule die im Raum ist anlehnen. Also so dass eher ein Eindruck entsteht wie als ob es fotografiert wäre.
    Und dann noch ein Paar Würfel im Raum mit Text. Aufkeinen fall mit so Objekten( So wie die Menschen bei deiner anderen Page) weil sonst weiß man nicht wo man hinkommt wenn man da drauf klickt

    Ja so is des meine Idee gewesen
     
    #3      
  4. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Danke für den Input, Brainless, das hört sich sehr interessant an.. Werd ihn auf jeden Fall ein beziehen! :)

    @Tobbsn: Cool, danke, auf die horizontale Idee bin ich noch gar nicht gekommen. Ich werd mal beides probieren und dann gucken, was besser kommt.


    Tobias
     
    #4      
  5. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Here we go. Habe einem Freund, Max Stepan, das fotografieren ein wenig gezeigt, und er hatte total coole Ideen für Posen und Accessoirs. Bin mit 3 fetten Sackerl und einer Reisetasche bei ihm angerückt, um ein Shooting bei ihm im Wintergarten zu machen.

    Total bittere Lichtverhältnisse, aber wir habens gemeinsam hinbekommen, ne Menge cooles Zeug zu machen.
    Ich weiß noch nicht genau, wie viele Bereiche meine Seite haben wird, aber ich hab mal sicherheitshalber 6 verschiedene Fotos.

    In der nächsten Zeit werde ich mich in photoshop austoben, ihr dürft gespannt sein, was aus den Fotos wird. :)


    [​IMG]


    [​IMG]


    [​IMG]


    [​IMG]


    [​IMG]


    [​IMG]


    Tobias
     
    #5      
  6. pepexx

    pepexx Moderator im Nutellawahn Teammitglied PSD Beta Team

    1776
    Dabei seit:
    01.11.2005
    Beiträge:
    11.715
    Geschlecht:
    männlich
    Software:
    Foddoschop
    Kameratyp:
    Sony A7 II - RX10 III - RX100 IV
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    lol - ich find die Bilder saucool. Bin mal auf das Ergebnis gespannt.
    Bei dem mit der Taucherbrille fängts schon an in den Fingern zu jucken und
    sich das mal vorzunehmen :)
     
    #6      
  7. Tattoomaus78

    Tattoomaus78 nemesis-artgroup.de

    654
    Dabei seit:
    23.08.2005
    Beiträge:
    5.328
    Geschlecht:
    weiblich
    Ort:
    auf und davon
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    auja...ich bin dabei :D
     
    #7      
  8. pepexx

    pepexx Moderator im Nutellawahn Teammitglied PSD Beta Team

    1776
    Dabei seit:
    01.11.2005
    Beiträge:
    11.715
    Geschlecht:
    männlich
    Software:
    Foddoschop
    Kameratyp:
    Sony A7 II - RX10 III - RX100 IV
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Gib es mal frei, dann machen wir nen kleinen Sonder-Contest draus :)
     
    Zuletzt bearbeitet: 23.12.2007
    #8      
  9. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Sofas ausgeschnitten, Farbkorrektur zu rotem Leder, schön pornös.

    Farbneutralisierung, Farbabstrahlung (rotes Leder reflektiert schließlich anders als braunes) und Helligkeitskorrektur fehlt noch, aber jetzt ist mal der feinmotrische Schnippelteil fertig... :)

    [​IMG]



    Gentle
     
    #9      
  10. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Und jetzt mal schluss mit dem Eyecandy; erste Teste wie die Frontpage aussehen wird.
    Ein Bildschirm-Screenshot von 1024x768, auf die Größe wird die Seite optimiert. :)


    ImageFlow 0.8



    Gentle
     
    #10      
  11. shaXx

    shaXx Aktives Mitglied

    Dabei seit:
    27.06.2006
    Beiträge:
    445
    Geschlecht:
    männlich
    Ort:
    Halle/Saale
    Software:
    Cinema4D R9, Photoshop CS2, Paint, Dreamviewer MX 2004, Flash MX 2004
    Kameratyp:
    Sony Cibershot, Medion 5in1
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    #11      
  12. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    Ich tanze auf vielen Hochzeiten, shaxx ;)

    Habe mir heute während ner Zugfahrt weitere Gedanken gemacht. Wird noch ne Menge Programmierarbeit auf mich zukommen :D

    Es wird eine dezente, sich-bewegende Tagcloud mit Zufallsbildern (als Bildtitel dargestellt) geben, die Navigation erfolgt über Objekte, nämlich ein Spraytag an der Wand in Form einer Kopfsilhouette, eine Staffelei, drei Geschenkpakete und einem "Impressum"-Schriftzug bzw. alternativ als Mouseover-Overlaybox der aktuellen Seitenposition, welche rechts als knalliger Schriftzug mit nasser Farbe an die Tapete gemalt sein wird.

    Die Galerie wir per Thumbnails am Bildschirm laufen und ähnlich navigierbar wie die auf der Frontpage sein (Javascript juche).

    Für die Anzeige der Galeriebilder usw. lasst euch überraschen - da kommt was ganz spezielles.


    http://www.tobiasdeml.com/pagewip/skizze-blei.jpg


    Gentle

    PS: Ich werde bald mal die Fotos so weit überareiten, wie ich kann (sprich so, dass sie gut aussehen ;) ). Sollten sie eine miese Qualität bekommen, werde ich ein neues Shooting machen, vertraue derweil aber auf meine Photoshop-Kenntnisse.

    The Show goes on.

    Die Fotos sind fast fertig bearbeitet (Abstimmung der Hauttöne fehlt noch), und mit dem Konzept gings auch voran.

    [​IMG]

    [​IMG]


    Gentle

    So, nen Schatten gibts jetzt auch noch :D

    [​IMG]

    Gentle


    D: Ganz großes Kino n Schatten einfügen...


    Nutz bitte EDIT... auch wenn das auf den anderen Plattformen, wo dein Thread noch so läuft nicht üblich ist...
     
    Zuletzt von einem Moderator bearbeitet: 07.01.2008
    #12      
  13. quixui

    quixui Noch nicht viel geschrieben

    Dabei seit:
    07.01.2008
    Beiträge:
    1
    Geschlecht:
    männlich
    Ort:
    Wien, Österreich
    Software:
    Adobe Photoshop CS2
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Die Schatten sehen meiner Meinung nach etwas seltsam aus - wo sollte die erzeugende Lichtquelle sein?

    Einerseits fällt Licht unter das Sofa - d.h. eine Lichtquelle müsste links und rechts neben der Kamera sein - andererseits fehlt dafür dann der von 2 Lichtquellen produzierte Doppelschatten.

    Vielleicht solltest du den Schattenwurf eher nach einer Lichtquelle in deiner virtuellen Wohnung erstellen. Ich denke dass dort der Schattenwurf noch wesentlich auffälliger wird als auf weißem Untergrund.

    lg,
    quix
     
    #13      
  14. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Hi quix,

    der Schattenwurf ist den oberen Fotos nachempfunden; kein direktes Licht, keine besondere Richtung, sondern einfach ein diffuser Schatten. :)

    alles klar, ja, mit dem mod_rewrite werd ich arbeiten!


    So, hier bisschen was neues ... :D

    Das sollten Navigationspunkte an der Seite werden, benutze sie aber wahrscheinlich nicht, sondern eher eine simple Schrift wie bei Teaser.

    http://www.tobiasdeml.com/pagewip/Font.jpg


    und hier eine weitere Skizze, wie es aussehen wird:

    http://www.tobiasdeml.com/pagewip/skizze3.jpg
    bzw. mit Funktionalität unter

    ImageFlow 0.8




    Gentle
     
    Zuletzt von einem Moderator bearbeitet: 14.01.2008
    #14      
  15. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Ich hab euch bisschen zum Narren gehalten mit der Skizze... ;)

    Damit ihr das Design mal ohne Content seht, habe ich auf eine contentlose Seite verlinkt, von der aus ihr dann rumnavigieren könnt.


    Tobias Deml, Art Generalist | Personal homepage and portfolio


    Ich habe eine Frage der Usability wegen: Es gibt insgesamt drei Wege, um auf die vier Hauptbereiche (Home, Portfolio, Bio und Downloads) zu gelangen.

    Die unterste Leiste bleibt ganz bestimmt (für Sehbehinderte bzw. Voicebrowser bzw. Tastatur-only-user), wie ist eure Meinung zu der Hoverbox beim Schriftzug rechts?

    Und: Macht es Sinn, beim Hovern/fokussieren der Textlinks die zugehörigen Bildlinks zu markieren, oder sollte ich das lieber wieder rausnehmen?


    Gentle


    PS@Moderation: Bitte in den Webdesign-Bereich verschieben, da die 2D-Arbeit jetzt fast abgeschlossen ist. Danke! :)
     
    Zuletzt bearbeitet: 14.01.2008
    #15      
  16. TobiasDeml

    TobiasDeml The great Hoden

    Dabei seit:
    28.12.2006
    Beiträge:
    170
    Geschlecht:
    männlich
    Ort:
    Los Angeles
    Software:
    Photoshop 6, Cinema 4D 10.5
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Heute war mein erstes Javascript-Fetischistenfest ... unglaublich, wie viel man da rumfutzeln muss, aber was solls, jetzt gehts :D

    [​IMG]
    (klick Bild)

    Für die GIF-Animationen werde ich einen Preload einbauen, allerdings erst in ein paar Tagen.

    Gentle
     
    #16      
  17. Herr_D

    Herr_D offline

    Dabei seit:
    09.06.2005
    Beiträge:
    8.557
    Geschlecht:
    männlich
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Respekt... vielleicht solltest du anfangen, Flash zu lernen... aber die Idee ist echt saukuhl...
     
    #17      
  18. Yoven

    Yoven Kleines Helferlein

    Dabei seit:
    08.11.2007
    Beiträge:
    260
    Geschlecht:
    männlich
    Ort:
    Daheim
    Software:
    PS CS2
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    stark... kann man eigentlich nicht mehr dazu sagen, aber ich würde wenns geht auch wenn du schon dabei bist nen preload für die sofas machen... sieht einfach toller aus wenn du da nicht zwischenzeitug beim menüwechseln nur schwazen bg hast...^^ das muss bei dem hammerdesign nicht sein^^
     
    #18      
  19. Lizman

    Lizman Allrounder

    Dabei seit:
    24.07.2005
    Beiträge:
    2.561
    Geschlecht:
    männlich
    Ort:
    Bremen
    Kameratyp:
    Pentax
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    ich hab das zwar schon ma so in der art gesehn.
    aber das ist oberaffentittengeil :)
     
    #19      
  20. Tack

    Tack ^^

    Dabei seit:
    02.11.2006
    Beiträge:
    460
    Geschlecht:
    männlich
    Software:
    Maya, Photoshop CS3,
    Kameratyp:
    Nikon D80
    Tobiasdeml.com - WIP von Anfang bis Ende :-)
    AW: Tobiasdeml.com - WIP von Anfang bis Ende :)

    Hier an dieser Stelle zolle ich dir öffentlich meinen Respekt.
    Klasse Idee!!!

    Mfg Tack
     
    #20      
x
×
×