Emojifying-Kontext: Entwicklung der Emoji-Glaubwürdigkeitsindikatoren von HackerNoon

Wir bei HackerNoon glauben, dass Transparenz gegenüber dem Leser der Schlüssel zum Aufbau von Vertrauen zwischen Autor und Leser ist. Um den Lesern so viel Transparenz wie möglich zu bieten, wollten wir schnelle und einfache Möglichkeiten schaffen, dem Leser Informationen zu geben, die er möglicherweise über eine Geschichte wissen möchte, bevor er sie liest.

Das kann etwas ganz Einfaches sein, wie dem Leser mitzuteilen, ob es sich bei der Geschichte um eine Neuigkeit oder einen Meinungsbeitrag handelt. Andererseits gibt es auch kompliziertere Dinge, die wir dem Leser mitteilen möchten, beispielsweise, ob der Autor ein persönliches Interesse an den Unternehmen hat, über die er schreibt, oder ob er beim Schreiben des Artikels KI verwendet hat.

Um diese Ziele zu erreichen, haben wir Emoji-Glaubwürdigkeitsindikatoren erstellt! Jetzt als Open Source auf Figma Community und GitHub verfügbar.

Entwerfen von Emoji-Glaubwürdigkeitsindikatoren

Tauchen wir nun in den Prozess der Entwicklung von Emoji-Glaubwürdigkeitsindikatoren ein. Der anfängliche Design-Brief von David und unserem Redaktionsteam umfasste 22 Emoji-Glaubwürdigkeitsindikatoren (siehe auch „ Jeder Emoji-Glaubwürdigkeitsindikator auf HackerNoon erklärt “), die in zwei Kategorien unterteilt waren: Kontext/Haftungsausschlüsse und Inhaltstypen. Zusätzlich zu ihrer Beschreibung wurde jedem Glaubwürdigkeitsindikator ein Emoji als Designinspiration zugewiesen.

Von da an konnten wir (Kien und ich ) unserer Fantasie freien Lauf lassen und diese Emoji-Indikatoren zum Leben erwecken. In Anlehnung an die Designsprache von HackerNoon haben wir uns für den Pixel-Art-Stil entschieden. Nachdem wir mehrere Optionen für Rastergrößen untersucht hatten, entschieden wir uns für ein 24-Pixel-Raster, da es den gewünschten Detailgrad beibehielt. Was die Software der Wahl angeht, war ich etwas voreingenommen und habe mich für Adobe Illustrator entschieden, da wir viele Optionen für den Export in verschiedene Dateitypen haben und ich mit dem Raster-Tool vertraut bin ( Adobe Photoshop , Aseprite und Corel Draw sind einige gute Alternativen).

Unser Pixel-Art-Designprozess besteht aus 5 Schritten, beginnend mit Grundformen, dem Zeichnen von Details, dem Erzeugen von Tiefe, dem Hinzufügen von Strichen und dem Zusammenführen von Formen und dem Exportieren in verschiedene Dateitypen. Lassen Sie uns diese Schritte genauer betrachten und dabei beispielsweise den Glaubwürdigkeitsindikator für Comedy-/Satire-Emojis verwenden.

Beginnen Sie mit Grundformen

Wenn wir Pixel-Art/8-Bit-Designs erstellen, beginnen wir mit einer Grundform, die mit der Idee, die wir im Kopf haben, übereinstimmt. Im Fall des Comedy/Satire-Emoji-Indikators (der vom Emoji „😂“ inspiriert wurde) ist dies eine Ellipse.

Zeichnungsdetails

Dann fügen wir der Form, die wir gerade gezeichnet haben, weitere Details hinzu (in diesem Fall etwa Gesichtszüge).

Tiefe erzeugen: Lichter und Schatten

Um es realistischer und weniger flach zu machen, fügen wir dem Gesicht Glanzlichter und Schatten hinzu. In diesem Fall wurde angenommen, dass sich die Lichtquelle vorne und in der Mitte befindet, wodurch sich die Schatten an die Ränder und die Glanzlichter in die Mitte bewegen.

Strich hinzufügen

Um es deutlicher zu machen, haben wir zum Abschluss einen Strich hinzugefügt.

Formen zusammenführen und exportieren

Um sie besser nutzbar zu machen, haben wir die Formen zusammengeführt und sie sowohl als PNGs als auch als SVGs exportiert.

Dann wiederholten wir diesen gesamten Vorgang noch 21 Mal und kamen schließlich zu den Emoji-Glaubwürdigkeitsindikatoren, die wir heute auf HackerNoon haben.

Das Endprodukt: Ein Open-Source-Pixel-Emoji-Paket

Zusammenfassend lässt sich sagen, dass die Emoji-Glaubwürdigkeitsindikatoren ein weiterer Schritt zur Verbesserung der Online-Kommunikation zwischen unseren Lesern und Autoren sind. Diese pixeligen Emojis dienen nicht nur als Glaubwürdigkeitsindikatoren, die dem Inhalt Kontext verleihen, sondern haben auch das Vertrauen und die Interaktion der Benutzer mit dem Inhalt beeinflusst. Sie sind ein Beispiel dafür, wie durchdachtes Design komplexe Konzepte auf einfache und doch intuitive Weise vermitteln kann.

Begleiten Sie uns auf dieser Suche nach Emoji-Kontexten und probieren Sie die Emoji Credibility Indicators von HackerNoon aus.

Bleiben Sie kreativ, bleiben Sie ikonisch.