typographie – interface. die medienwerkstatt

hi leute!
ich habe hier schon viel über graphische designs gesprochen. für alle, die dadurch ein großes interesse an der ausbildung digital und print entwickelt haben, zeige ich euch hier die grundbausteine einer gestaltung und wie eure designs im handumdrehen professioneller gestalten könnt.

1. symetrie vs asymetrie
durch spielen mit symetrien könnt ihr euer designs in die richtige form bringen. symetrien sowie asymetrien können wir überall in der natur finden. grundsätzlich könnt ihr durch gleichmäßige formen und durch eine ebenmäßige verteilung ruhe und balance in eure gestaltung bringen, während asymetrie aufregung erzeugt. praktisch werdet ihr oft mit beiden spielen wollen, umbestimmte elemente hervorstechen zu lassen, oder eure gestaltung in genau dem ton strahlen zu lassen, den ihr ausdrücken wollt.

In diesem foto einer drohne sieht man deutlich die symetrieachse. dennoch werden durch die autos noch asymmetrische elemente eingebaut, die dem bild dynamik verleihen

2.größe
ein weiterer riesiger aspekt den ihr nicht einfach übersehen solltet ist mit größe zu spielen. größe ist immer relativ, und dieser kontrast sollte sich auch in euren designs wiederspiegeln. die größe zeigt ihre bedeutung. sie kann objekte nah oder fern erscheinen lassen oder dinge heraustechen und wichtiger erscheinen lassen. ihr könnt spannungen zwischen einzelnen elementen enstehen lassen durch den kontrast an größe. dinge die normalerweise groß sind, klein darzustellen und vice versa kann ebenfalls spannung erzeugen.

die größe spielt hier eine wichtige rolle um das „more“ herausstechen zu lassen. es ist im vordergrund und wichtiger als alles andere.

3.umrahmungen
alle designs haben eine umrahmung, da sie eine fest definierte fläche haben, in der sie beginnen und in der sie aufhören. ein rahmen zentriert unseren blick und bildet eine klare linie, die wichtigen von unwichtigem trennt. ränder lassen motive weiter weg wirken, während durch unschärfe suggeriert werden kann, dass man sich quasi in dem bild befindet. durch das zuschneiden von bildern ändert ihr auch die dynamik von diesen. eine weitere wunderbare methode ist es, den inhalt aus den rändern herauslaufen lassen. das erzeugt eine ungezähmte spannung und aufregung.

durch das herausragen aus ihrer umrahmung wirkt diese spielerin dynamischer und aktiver, was die aussage dieses plakates erstklassig unterstützt

4.hierarchie
in der hierarchie dreht sich alles um den unterschied. es lenkt das auge auf eine bahn, die die wichtigsten informationen zuerst raustechen lässt und ist daher besonders wichtig in medien wo sehr viel information auf einer seite ist, wie beispielsweise speisekarten oder auch inhaltsangaben. es gibt die unterschiedlichsten art und weisen, etwas herausstechen zu lassen. ihr könnt die vorher genannten methoden benutzen aber auch beispielsweise durch farben einen kontrast bilden. die besten designs sind innovativ und durch unkonventionelle arten kann direkt aufmerksamkeit erregt werden. probiert euch aus und setzt die überschift mal nicht ganz nach oben sondern mittendrin. je ungewöhnlicher es ist, desto besser sticht es heraus und verleiht eurem design individualität und dynamik.

auch wenn hier viel text verwendet wurde, wirkt diese diät liste sehr dynamisch und gleichzeitig sehr strukturiert, da darauf geachtet wurde, dass wichtige informationen dicker und größer dargestellt werden.

5. gitter
gitter sind phänomenale möglichkeiten struktur reinzubringen. indem ihr euch vorher ein gitter zieht und genau bestimmt, wie groß welches element ist und wie viele spalten und zeilen es einnehmen darf, könnt ihr erstens einen zusammhang zwischen all diesen elementen entwickeln, was bei einem mehrseitigen produkt wie etwa magazine wichtig ist. gleichzeitig könnt ihr wesentlich besser mit weißräumen arbeiten, da die elemente nun miteinander verknüpft sind und nicht mehr leer im raum zu schweben lassen.

an diesem szenarischen beispiel kann man gut sehen, wie einzelne elemente unterschiedliche eigenschaften besetzten können, aber durch das setzten eines gitters trotzdem eine struktur zu erkennen ist

habt ihr etwas neues gelernt? schickt uns doch eure designs auf unseren social media plattformen und wir geben dir ein feedback darauf

euer alex

also, typo bedeutet schreiben oder auch schrift und grafie bedeutet malen. typografie ist die kunst eine schrift darzustellen.

lesen und schreiben ist das normalste für jeden von uns. egal ob kleine notizen, mitschriebe in der schule oder uni, briefe, mails, nachrichten in mesengerdinsten oder beiträge auf socialmedia seiten.

jeder und jede von euch schreibt jeden tag ob nun on hand, am pc oder am handy und jeder und jede von euch liest auch jeden tag ob nun in gedruckter oder digitaler form. aber habt ihr euch schonmal überlegt woher die schrift kommt, die ihr nutzt? – klar, wenn man von hand schreibt ist das einfach. ein stift und papier und einfach schreiben, so wie man es in der schule gelernt hat.

in der schule habt iht bestimmt auch gelernt, dass man früher – also bis vor über 500 jahren – nur so geschrieben hat. ganze bücher wurden von hand geschrieben mit tage, wochen, monate oder auch jahrelangem zeitaufwand – und mit entsprechenden kosten. bestimmt habet ihr auch gelernt, wann und von wem der buchdruck erfunden wurde. aber das ist eine andere geschichte – die hier vielleicht auch noch erzählt wird.
eine der grundlagen des buchdrucks beschäftigt uns jetzt aber aus einem anderen grund. denn wie entstehen die schriften und buchstaben für den buchdruck von damals und natürlich auch für die schriften, die wir heute überal lesen und mit denen wir schreiben können? in zeiten des alten drucks hat man buchstaben – und davor ganze buchseiten – spiegelverkeht geschnitzt, sie zu seiten zusammengesetzt und dann mit diesen gedruckt. dies habt ihr bestimmt alle schoneinmal selbst gemacht. – glaubt ihr nicht? stimmt aber schon denn bestimmt hat jeder und jede on euch schonmal einen stempel genutzt oder soar selbst hergestellt. dies ist das gleiche prinzip wie der alte buchdruck. viel interesanter für uns ist allerdings, wie die schriften entstehen, die wir auf unseren bildschirmen sehen, denn diese werden natürlich nicht mehr in holz oder metall geschnitten.

schriften, die man digital nutzt entstehen natürlich auch digital. ein typograph – also jemand, der sich profesionel mit der gestaltung von schriften auseinandersetzt – überlegt sich, wie eine neue schrift aussehen soll. dies bedeutet, dass er oder sie sich überlegt, wofür diese schrift verwendet werden soll, wie dick sie sein soll, wie breit oder schmal die einzelnen buchstaben sein sollen, oder ob diese schrift serifen – die kleinen querstriche am anfang oder ende eines buchstaben – hat oder auch nicht. wird es eine schrift mit feinen schnörkeln – wie eine altmodische sehr schöne handschrift – oder sieht diese schrift aus als stünde sie auf einer pixeligen anzeigetafel in der s-bahn. Auch spezielle schriften, die man auf den covern bekannter bücher oder als titel von serien und filmen sehen kann wurden so gestaltet z.b. die schrift von „harry potter“ oder „games of trones“.

also wie gestaltet man diese schrift nun, wenn man entschieden hat, wie sie aussehen soll? nun, man beginnt damit, dass man diese schrift am pc zeichent – natürlich kann man davor skkizen und zeichungen von hand anferigen. wärend man seine neue schrift zeichnet entwickelt man sie natürlich auch weiter, wenn man sieht wie sie in digitaler form oder auf papier aussieht. nach der langen zeit des entwerfens, gestaltens, weiterentwickeln und zeichnens hat man seine fertigen buchstaben und sonderzeichen – den natürlich wollen ä,ö,ü,ß, fragezeichen, ausrufezeichen, das euro-zeichen oder ein einfacher punkt auch designt werden. also, wenn man seine fertigen buchstaben und zeichen hat ist man noch nicht fertig, denn man schreibt sehr selten einzelne buchstaben sondern eher ganze wörter. dafür brauchen die buchstaben passende abstände zueinander, schließlich sollen die buchstaben nicht ineinander stehen und die abstände zwischen den buchstaben und wörtern sollte man auch auseinander halten können. da man jenachdem, was und in welcher sprache man schreibt, können alle buchstaben und zeichen beliebige nach und voreinander stehen.

deshalb muss man für alle buchstaben- und zeichenpaare, die man mit allen 26 buchstaben des alphabetes und aller designter sonderzeichen kreieren kann, festlegen welcher abstand innerhalb dieser paare vorgegeben wird. alein bei den 26 buchstaben des alphabetes sind das schon 676 möglichkeien, die man festlegen muss.
bestimmt habt ihr auch schon gesehen, dass man einige schriften nicht nur einen schriftschnitt haben sondern, dass es diese schrift auch fett, kursiv – schräggestellt – oder mit breiteren oder schmäleren buchstaben und buchstabenabständen gibt. dies wir natürlich auch von dem typographen designt und wie die normale schrift mit allen notwendigen daten und abständen versehen.

jetzt wisst ihr ungefähr, wie die schrift entstanden ist, die ihr hier gerade lest und könnt euch mit sicherheit auch vorstellen, wie viel arbeit in dieser schrift steckt. könnt ihr euch vorstellen auch selbst eine schrift zu designen?

probiert es doch einfach mal aus. wir benutzten die kostenlose software „fontforge“ um unsere Schriften zu entwickeln.

eure dorothee

Schlagwort: typographie

graphic design basics – die grundbausteine für design

toyp… was?