Womit entwerft ihr eure Webseiten

[Sargas]

Hi Leute,

bisher habe ich meine Webprojekte immer auf Basis von Bootstrap zusammengebaut. Da ich das jetzt aber gerne komplett selbst machen würde stehe ich so ein bisschen vor dem Problem, dass ich keinen so richtigen Plan habe. Daher die Frage an euch, was nutzt ihr um eure Entwürfe zu machen (die auch schonmal etwas detailierter sein können).

Photoshop? Gibt ja viele Templates als PSD. Illustrator? Sketch?

Es geht mir hier nich um die Umsetzung, sondern rein darum wie das Ganze am Ende aussehen soll. Falls ein Tool nur für ein bestimmtes Betriebssystem verfügbar ist bitte anmerken

Bin gespannt.

 

[Rata]

was nutzt ihr um eure Entwürfe zu machen (die auch schonmal etwas detailierter sein können)

Betriebsystemübergreifend: Bleistift und „Ratzefummel“, wenn die Irrlichter im Kopf schon Konturen haben sogar mit Füllhalter
Details beschreibe ich in Worten.


Ungewöhnlich in Zeiten von allgegenwärtigen „MockUps“, aber ernst gemeint



Lieber Gruß
Rata

 

[patrick_l]

Moin Philipp,

Daher die Frage an euch, was nutzt ihr um eure Entwürfe zu machen (die auch schonmal etwas detailierter sein können).

Wenn das Mockup lediglich für mich bestimmt ist und kein funktionierender Prototyp benötigt wird, entweder »oldschool« mit nem Stift in einem DIN A6 Heftchen skizziere. Die Skizzen dann noch mit Notizen versehe. Bei größeren Projekte zusätzlich auf einem Whiteboard (90x60cm) ausweiche.

Spoiler: Beispiel: Mockup DIN A6

Für Prototypen in der Regel Axure RP verwende. Axure RP ist eine Wireframing Software, in der man dank zahlreicher Module (wie ich sie jetzt einfach mal nenne) schnell funktionale Prototypen zusammenklicken kann. Vor allem bietet das Programm einige interessante Tools, die bei der Planung von Apps und responsive Websites hilfreich sind.

Axure RP gibt sowohl für Windows als auch für Mac und wird in zwei unterschiedlichen Versionen angeboten. Standard und Pro. Wenn man nicht im Team arbeitet, reicht die Standard voll und ganz aus. Die Einzellizenz kostet knapp 280,-€. Ob sich das lohnt, muss jeder selber schauen. Wenn Interesse besteht, einfach mal die Testversion herunterladen und 30 Tage lang testen.

Als günstigere Alternative noch Balsamiq Mockup nennen kann. Der Funktionsumfang ist deutlicher geringer und man ist längst nicht so flexible wie in Axure, trotzdem fürs einfache Wireframing ausreicht. Die App kostet knapp 90,-€ und wird ebenso für beide Plattformen (Win/Mac) angeboten.

Wenn du Anfangs kein Geld ausgeben kannst oder möchtest, mir noch Pencil einfällt, welchen du dir anschauen kannst. Gibt es einmal als native Desktopanwendung (Win/Mac/Linux) sowie als Firefox Extension. Entwicklungsmäßig tut sich da schon länger nichts mehr. Aber immerhin gibt es ne stable

Liebe Grüße, Patrick

 

[Sargas]

Danke euch schonmal. Ist ja schon interessant, dass ihr da mit Papier und Stift rangeht. Mir schwebte in meiner Frage jetzt schon etwas vor, wo ich auch schonmal meine Schriftart im Kontext mit Farben etc. sehen kann. Das dürfte auf Papier schwierig werden.

Freue mich natürlich weiterhin über Beiträge.

 

[Dobi78]

Ich ganz einfach mit PS. Dann lade ich die psd Dateien in die Cloud und habe sogar noch die ganzen CSS Angaben.
Was will man mehr.

 

[Sargas]

Ich ganz einfach mit PS. Dann lade ich die psd Dateien in die Cloud und habe sogar noch die ganzen CSS Angaben.
Was will man mehr.

Da brauchts dann aber die CC zu oder?

 

[Dobi78]

Da brauchts dann aber die CC zu oder?

Ja brauchst du

 

[Mr_Chris]

Hi

Invision ist ne super Anwendung um die ersten Entwürfe zu entwickeln. Entweder für sich alleine oder um im Team Dinge zu besprechen.
Ich hab damit schon sehr große Projekte umgesetzt oder Teile weiter entwickelt.
http://www.invisionapp.com

LG Chris

 

[Fugel]

Ich verwende neben Stift und Papier InDesign, das bietet sich für mich durch die Absatzformate und Co. gut an.

 

[Sargas]

Hab mir jetzt mal PS CC die Testversion installiert und muss sagen, dass die Handhabung von Vektorformen deutlich besser ist als bei meiner CS 5, gerade wenn man Farben, Konturen, Schatten aber auch die Größe und Rundung der Ecken bearbeiten will. In Kombination mit Papier+Stift reicht das für meine Zwecke im Moment.

Ich setz es aber mal noch nicht auf erledigt, können ja immer noch bisschen was sammeln.

Danke euch

 

[Dobi78]

@Sargas kannst Du das auch in die Cloud laden mit der Testversion?
Da wirds richtig lustig.... hast grad die CSS Eigenschaften dabei Ich find's praktisch.

 

[Sargas]

@Dobi78 Ja, geht auch, ist echt parktisch. Kann auch die PSD in Brackets reinladen. Habs da leider noch nicht geschafft alles komplett zu kopieren, da bekomm ich nur "Hints" wenn ich im CSS schreibe. Mal schauen wies so läuft.

 

[DoctorG]

Bin auch Pencil-User. Bei mir geht's um UX-Design. Kann mal eine Website, mal eine App, mal ein Windowsprogramm oder auch Navi-System sein. Im Kern arbeite ich damit immer, wenn es um Oberflächen allgemein.
Dafür ist Pencil recht fein und zudem Open Source. Es gibt auch Unterstützungen für Web-basierte Systeme, da ist das Ding aber nicht in besonderer Weise drauf optimiert oder so.
Damit moderiere ich mit Kunden zusammen, was man sich so wünscht und untermauere Vorstellungen.
Meist suche ich dann dazu passende Themes heraus und schlage das dem Kunden vor. Pixelgenaue Festlegungen vermeide ich in frühen Phasen. 99% meiner Kunden interessiert weniger das Pixel sondern eher ob die Bedienbarkeit, Auffindbarkeit etc. im Gesamtbild stimmen - das dann aber gerne über über Geräteklassen hinweg. Beim heutigen Umfang von Themes einerseits und der Projektgröße anderseits komme ich selbst überhaupt nicht mehr auf die Idee zu Fuss Oberflächenelemente selbst zu machen.