Hiermit starte ich also einen neuen Thread, und damit der nicht gleich wieder gschlossen wird (“Warum nicht in den pics-Thread?”), hier zunächst ein paar Argumente.

- Icons haben im Grunde einen anderen Zweck als “normale” Grafiken. Ein Icon soll schnell (wieder-)erkennbar sein.

- Der Thread soll auch dazu dienen, über Piktogramme zu brainstormen: Was ist ein passendes Symbol für …?

- Ich hab’s gern modular.

- Es gab schon ganz andere Threads …

Aber genug des Disclaimers.

Ein Piktogramm oder Icon ist die vereinfachte grafische Darstellung einer bestimmten Information. Dem Betrachter ist es möglich sollte es möglich sein, auf einen Blick die Botschaft zu erkennen.

Ich beginne einfach mit einem Iconset, woran ich hie und da mal arbeite. Das Ganze bezieht sich auf “Dateien und Verzeichnisse”, d.h. Dateitypen:

Von links nach rechts:
Film, Ordner, Text, Verlinkung, Bild, Sound

und Dateiattribute:

Von links nach rechts:
Erstellungsdatum, Kommentar, Dateigröße, durchschnittliche Dateigröße (in einem Verzeichnis)

Es ist alles noch WIP.

Woran ich verzweifle:
Ich benötige noch ein Symbol für “Zuletzt geändert” (Editierdatum), (Datei-)Anzahl und Zugriffsrechte.

Website

Mit einer Verlinkung verbinde ich immer irgendwie einen Pfeil, aber ich nehm an das Iconset wird hauptsächlich im Webbereich Einsatz finden. Also ist ein Globus schon ok. Der Globus und das Bild von dem Baum sind auf den ersten blick nicht zwingend als solche zu erkennen - hauptsächlich wegen den fehlenden Farben. Die anderen Symbole sind auf den ersten Blick klar. Nur bei einer Uhr denke ich eher an Uhrzeit als an Datum... Kalenderblatt?

Hier noch Vorschläge für die gesuchten Symbole:
Editierdatum... das Erstelldatumssymbol mit Bleisift/Radiergummi ? oder einfach 8:05 statt 8:00 wie fürs Erstellungsdatum
Dateianzahl... Dateisymbol und ein kleines 123...
Zugriffsrechte... Person/Schlüssel ? in der Art -> http://www.joomla-downloads.de/images/stories/symbol-benutzerrechte.jpg

O o
/¯¯/_o___o___o___o____o__
\__\¯¯o¯¯¯o¯¯¯¯¯¯o¯¯¯¯¯¯o
i'm doctoroctogonnafuckinggonnapus blaaaaaaaaaaargggggg-

Ist für’s Web, ich hätte vielleicht »Hyperlink« schreiben sollen. Den genauen Einsatzbereich weiß ich auch noch nicht.
Bei den Icons kommt es zum Glück nicht so darauf an, dass man sofort erkennt, was sie darstellen, da ich jeweils einen Begriff dazu schreiben werde.

Die »123« für Anzahl ist naheliegend, allerdings auch sehr unspektakulär.
Das mit dem Kalenderblatt ist gut; wahrscheinlich werde ich das für »Editierdatum« benutzen. Es geht zunächst nur um den Wiedererkennungswert.

Zugriffsrechte, Schloss, Schlüssel … warum bin ich da nicht selber d’rauf gekommen‽

Kategorie, $Anzahl, Autor, Autor

Welches Autor-Icon? Das rechte gefällt mir besser, hat aber den Nachteil, dass es aufgrund des Krawattenzipfels kleiner skaliert werden muss kleiner ausfällt.

*edit
Das Interrobang sieht wirklich arg unschön aus.

Website

Also fuer den ersten Satz Symbole: Bis auf die Verknuepfung alles klar und eindeutig. Du solltest das vielleicht durch einen Pfeil oder eine Kette oder einen Pfaden erweitern, damit man leichter sehen kann, dass dort etwas verbunden wird.

Die Dateiattribute ueberzeugen mich optisch nicht wirklich. Bauchmeinung.

Das Erstellungsdatum: Die Uhr assoziiere ich mit etwas fortlaufendem, der Erstellungszeitpunkt ist aber, wie der Name sagt, ein fester Zeitpunkt. Wie waer es mit einem Stempel in Uhrform?

Das 123: Naja, es sind Zahlen, ich habe mir die Bilder zuerst angeschaut und fuer mich war es nicht eindeutig. Wenn es eine Anzahl von Sachen dastellen soll, dann sollte man diesen Kontext auch dazu anzeigen. Ein Stapel Blaettern mit einem danebenstehen Lineal waere vielleicht sinnvoll um die Dateianzahl zu symbolisieren, wobei das auch wieder nicht eindeutig oder missverstaendlich ist.

There is nothing wrong with high standards. It's your problem that you don't meet them.
If you think it's simple, then you have misunderstood the problem.
When a customer says "nothing has changed", assume they're lying.

Also für den Hyperlink verwende ich jetzt einen Kasten mit einem Pfeil nach rechts oben, so wie man es von manchen Websites für die Kennzeichnung von externen Links kennt.

Die Dateiattribute waren schlampig, gebe ich zu.

Hier jetzt ein etwas anderer Stil, allerdings immer noch grau. Die Symbole haben keinen Zusammenhang.

vlnr: Uhr+Stift (Editierdatum), Sprechblase (Kommentare, Nachricht), Kalenderblatt (Datum), Uhr (Uhrzeit oder Zeitdauer), Gewichte (Dateigröße), 2 Ordner (Kategorie), Stift (Editieren), Kopf (Autor), 123 (Jaja, immer noch Anzahl)

Ist das grau noch gut zu erkennen, oder schon zu hell?

Die “Anzahl” möchte mir noch nicht gefallen. Die Idee mit dem Blätterstapel + Lineal ist zwar gut, allerdings bei 16×16 px schwer umzusetzen.

Website

genausowenig erkenne ich bei dem "123" bei 16x16...

Resetting politics:
http://www.onlinepartei.eu

Schaut gut aus, aber ich würde den Kontrasst ein wenig erhöhen -> alles ein bischen dunkler machen

Heut' debug ich morgen brows' ich übermorgen cast' ich die Königin auf int
http://doubledtown.myminicity.com/

Warum nicht einfach die "123" durch eine "#" ersetzen? Steht zwar eigentlich für die Nummer, aber das kann man imo besser mit Anzahl verbinden als die Zahlenfolge.

(aka MDK_Woronesh)
Übertreibungen sind als Stilmittel anzusehen :)

wie wäre es mit einem 'n' für die Anzahl, wie in der Mathematik?

Resetting politics:
http://www.onlinepartei.eu

Stimmt, das “123” in 16×16 ist absolut nicht hinnehmbar.
Ein Gartenzaun und “n” sind mMn aber auch nur einem sehr begrenzten Publikum zumutbar.

Bei dem Kontrast bin ich mir noch nicht sicher. Ein paar mehr Meinungen wären schön. Auf meinem TFT ist es auch schon grenzwertig, während es auf der Röhre perfekt zu erkennen ist.

Ehrlich gesagt sind die alle auch noch so, wie sie Gimp aus der Vektorgrafik gerendert hat. Ich denke da kann man mit Pixelschieberei noch die eine oder andere Unreinheit herausholen.

Website

ok, noch meine Meinung zum Kontrast:
Ich sehe es gerade auf einem relativ heiklen laptop-tft.
die größeren Icons sind problemlos zu erkennen. wenn ich so scrolle, dass die 16²-icons am unteren bildschirmrand sind erkenne ich so gut wie nichts (außer - natürlich - ich beuge mich runter) --> zu schwach.

Resetting politics:
http://www.onlinepartei.eu

Getreu nach dem Motto “Release early, release often”:

vlnr: Schloss ($Rechte), Blatt (Textdatei), löschen, hinzufügen, bestätigen, helfen, abbrechen, RSS

Jetzt gibt es ein bisschen mehr Kontrast und so gefällt es mir schon ganz gut.

Website

Ja, mit mehr Kontrast sieht's gleich besser aus. Vor allen Dingen auch seitdem du die Farbfüllungen rausgenommen hast!

Ich hab kürzlich für nen Kumpel ("Nachbarschaftshilfe") ein paar Menüicons gemalt, die er für eine Webseite brauchte. Sind jetzt zwar alle gleichzeitig bunt dargestellt, aber im Einsatz nachher sind sie ausgegraut und nur das aktive und das mit Hover sind farbig:

Erfrischende Abwechslung zu dem ganzen Webzwonull-Kram, der gerade so in ist (glossy, shiny, wet floor …).
Die teilweise unterbrochenen Strokes bringen mich aber bei manchen Symbolen eher durcheinander. Beim Kalender beispielsweise finde ich den Abbruch zu abrupt. Genauso bei den Sprechblasen, wobei es mich da weniger stört; … während es bei der Hantel aber sehr cool aussieht.

Den Staffelstab mag ich nicht. Ohne den Titel hätte ich es nicht erkannt.

Website

So, zum ersten Mal wirklich Pixel geschubst, d.h. alles mit Rastergrafikprogramm nachbearbeitet.

Diesmal kein vlnr, da ich hoffe, es ist eindeutig genug. (*e in #011 wäre es wohl noch weniger notwendig gewesen)
Das sechste von links ist ein Twitter-Vogel. Obwohl ich Twitter nicht viel Euphorie entgegen bringen kann, hab’ ich’s mal mit rein genommen; scheint sehr gefragt zu sein laut derzeitiger Recherchen.

Ich hoffe auch, dass beim zweiten von rechts die Konturen noch klar genug erkennbar sind.

Website

was ist ein twitter-vogel?

ich kann jetzt spontan nichts anfangen mit (vlnr):
3,5 (statistik?),6,8,10

dem pdf-icon würde nen roter punkt gut stehen - da ist immer ein roter klecks! ;)

"selbermachen rockt am meisten :D" - -LeJean-

Zitat:

was ist ein twitter-vogel?

Twitter selbst sollte wohl seit Obama’s Feldzug und Schäfer-Gümbel’s lächerlichem Kopierversuch bekannt sein.

Zitat:

ich kann jetzt spontan nichts anfangen mit (vlnr):
3,5 (statistik?),6,8,10

Zitat:

dem pdf-icon würde nen roter punkt gut stehen - da ist immer ein roter klecks! ;)

Website

http://www.infomarketing.de/assets/89/PDF_File_normal.jpg z.B. - so erkennt man das symbol sofort (ob dann pdf draufsteht oder nicht ist erstmal egal)

"selbermachen rockt am meisten :D" - -LeJean-

Naja, was solls …

42 Icons, 16×16
Geplant sind noch die Größen 24×24 und 32×32 in den Dateiformaten PNG und TIF.

Von links nach rechts und von oben nach unten:
Twitter, Upload, Settings, Refresh, Hard-Drive, PDF-File,
Zoom out, Zoom in, (TV-)Screen, Lock, Folder, File (remove),
Weights, Star, Trash, Home, Diagram, File (help),
Comments, RSS, Edit, Author, Edit (time), File (confirm),
Pictures, Warning triangle, Arrow down, Link, Time, File (cancel),
Movie, Attachment, Mail, Download, File (add), Search,
File, Arrow up, Arrow right, Redo, Arrow left, Undo

Ja, ich habe mich völlig vom eigentlich vorgesehenen Verwendungszweck gelöst.

Website

sehr gute arbeit! einzig mit "link" kann ich nix anfangen (soll sicher ne kette darstellen?)

"selbermachen rockt am meisten :D" - -LeJean-

Danke.
Jo, sollen 3 Kettenglieder sein.

Diverse Programme nutzen solch ein Symbol + Globus, da mir aber der Platz für den Globus fehlt, habe ich mich auf die Kette beschränkt.

http://images.google.de/images?q=icon+hyperlink

Website

ahh da geht ein licht auf :)

mal probiert die ränder rund zu machen, statt so eckig? (1pixel in der ecke weg z.b.)

"selbermachen rockt am meisten :D" - -LeJean-

Also Twitter, HD und File (remove) würde ich nochmal überdenken.
Soweit ich weiß hat Twitter doch einen Vogel als Symbol und keinen Seehund(?).
Die HD ist Neunutzern sicher nicht sofort erkennbar, aber das ist sowieso ne Kunst, Neulingen das beizubringen.
Das gleiche Problem hat auch File (remove), denn ein Stop-Schild würde ich eher mit Benutzungsrechten gleichsetzen, ähnlich "No Entry.".

Sonst kann man alle Nachvollziehen. Hast du schon darüber nachgedacht, noch ein paar Folder Piktogramme zu machen? In anderen Iconsets, waren die afaik ziemlich oft in verschiedenen Ausführungen zu finden.

(aka MDK_Woronesh)
Übertreibungen sind als Stilmittel anzusehen :)

Zitat:

mal probiert die ränder rund zu machen, statt so eckig? (1pixel in der ecke weg z.b.)

Zitat:

Soweit ich weiß hat Twitter doch einen Vogel als Symbol und keinen Seehund(?).

Hier mal ein Vergleich (6-fache Vergrößerung) zwischen Vorlage und meinem Icon:

Zitat:

Die HD ist Neunutzern sicher nicht sofort erkennbar, aber das ist sowieso ne Kunst, Neulingen das beizubringen.

Bei dem Datei-Löschen Icon werde ich den Strich etwas kürzer machen. Eigentlich soll das ein Minuszeichen sein :|

Zur Not hat der Anwender für diesen Zweck noch den Trash.

Zitat:

Hast du schon darüber nachgedacht, noch ein paar Folder Piktogramme zu machen?

Website

Probier doch mal für "Festplatte" einen Stapel runder Scheiben und einen Lesekopf zu pixeln. Damit ist die Assoziation zu "Platte" schon eher gegeben und das Innere einer Festplatte wird imho eher richtig erkannt als eine Rechteckige Box, auch wenn man natürlich als Anwender das Innere nie zu sehen kriegt.

Die Überlegung ist einfach: Den inneren Aufbau einer Festplatte kennen die Meisten aus dem Fernsehen, da wird das nämlich öfters mal gezeigt.

Es gibt 2 Möglichkeiten, eine Kristallkugel zu benutzen:
a) um damit Spekulationen über ein Problem eines Users zu machen und
b) um sie einem besonders unkooperativen User über den Schädel zu ziehen.
- bloggt jetzt auch selbst auf Sclavia.de