Kinetisk typografi En inledande guide

Kinetisk typografi verkar vara överallt i dessa dagar. Från TV-reklam till webbplatsens målsidor är rörlig typ ett populärt visuellt verktyg. Denna popularitet kan komma från ett antal anledningar, men en uppenbar faktor är att den fångar din uppmärksamhet. Människor tenderar att dra till ord och vill läsa dem.

Kinetisk typografi lägger detta tillsammans med några enkla animeringar för att skapa ord som rör sig på skärmen, tar tag i din uppmärksamhet och engagerar sinnena. Så låt oss ta en titt på kinetisk typografi och hur du kan integrera den i några av dina designprojekt. (Obs! Exemplen i den här artikeln inkluderar animering, klicka på bilderna för länkar till de ursprungliga källorna för att se dem i åtgärd.)

Vad är kinetisk typografi?

Kinetisk typografi avser skapandet av rörlig typ. Det är en animeringsteknik som används för att göra bokstäverna expandera, krympa, flyga, flytta i slowmotion, växa och ändra på många sätt för användaren. Effekten kan vara enkel och kort med endast små förändringar eller ganska utarbetade och långa.

Kinetisk typografi användning har nästan exploderat nyligen på grund av mer användning av tekniken i webbdesign. En gång någonting som bara användes i video och tv, blir kinetisk typografi populärare som bakgrundseffekt på webbplatser och i webbaserade videor. (Allt detta är möjligt tack vare högre och vanligare bredband och ökad internet- och websurfningshastighet.)

Tekniken används av flera skäl men kan lägga tonvikten på visst innehåll. Det kan hjälpa till att förmedla ton och känsla. Det kan hjälpa till att skapa en unik visuell där ingen finns. Det kan vara ett prisvärt alternativ för dem med begränsade budgetar. Det kan ge intresse när din design behöver öka.

Ursprung av kinetisk typografi

Medan kinetisk typografi kan märkas som en framväxande trend för webbdesign idag har det funnits ganska länge. Det användes först på storskärmen.

Forskare vid Human Computer Interaction Institute och School of Design vid Carnegie Mellon University har spårat den första användningen av kinetisk typografi till 1959-filmen Alfred Hitchcocks 1959-film? North by Northwest.? I öppningskrediterna används typ i ett rörligt format. Ett år senare användes effekten igen i? Psycho.? ? Det här arbetet berodde delvis på en önskan om att öppna krediterna ställde scenen för filmen genom att skapa en stämning, snarare än att helt enkelt överföra informationen om krediterna? forskare skrev.

Från denna tidpunkt blev kinetisk typografi vanligare i film och senare i tv. Den har använts i krediter, under föreställningar och för annonser. En anmärkningsvärd användning av kinetisk typografi i reklam kom 2009 när Pepsi lanserade en? Uppdatera allt? kampanj (nu kallad? Pepsi Pulse?) med en ny logotyp. Den nya designen - med en logotyp i stället för bokstaven "o" - kom överallt från tv till online med rörlig typ.

Nyligen har det blivit en allmänt använd teknik inom webbdesign (och för vissa mobila appar) och är ganska vanligt i videofilmer. Den används för allt från reklam och marknadsföring till konst till musikvideor till ett berättande verktyg för journalister.

När ska du använda kinetisk typografi?

Kinetisk typografi är ett roligt verktyg för ditt kit, men det är inte en lätt lösning på det jag-inte-har-något-art-så-nu-vilket problem. Den ska användas - som något annat verktyg - för ett visst syfte och med ett visst mål i åtanke.

Det finns användningar där kinetisk typografi har visat sig vara särskilt effektiv. Dessa användningar hänför sig mest till tonen. Att lägga till rörlig typ till något som annars skulle vara statiskt i naturen kan lägga till hjälp för att uppnå detta. De bästa användningarna för kinetisk typografi inkluderar:

  • Skapar känslomässigt innehåll
  • Skapa tecken
  • Fånga uppmärksamhet

Vägen typ flyttar bidrar också till dessa användningsområden, enligt forskning. Till exempel:? Loudness kan efterliknas genom att ändra storleken på texten, dess vikt, och ibland kontrast eller färg. För höga volymer kan rörelser som efterliknar vibrationer användas. I skapandet av tecken kan typen sättas att flytta på ett sätt som efterliknar mänsklig rörelse och kan vidare animeras till? Bifoga? till föremål eller former på sätt som skapar rumsliga relationer eller skapar föreningar i en specifik riktning.

Kinetic Typography Applications

Nu när du börjar bli upphetsad om tanken på kinetisk typografi, hur kan du använda den i praktiska tillämpningar? Vilka medier fungerar bäst?

För det första är rörlig typ ett video- och onlineformat. Om du inte skapar en flipbook finns det få användningsområden för detta koncept i tryckta projekt. Det är viktigt att tänka på din publik och hur mycket tid de kan spendera med en animering. Att hålla det kort rekommenderas för webb- och mobilapplikationer, medan du i film eller reklam kan ha lite mer tid med varje användare.

Hur som helst är det viktigt att skapa något som är intressant, lätt att läsa och förstå och det skapar en känslomässig koppling. Vanliga praktiska användningsområden för kinetisk typografi inkluderar utbildningsanvändningar, till exempel den populära? Schoolhouse Rock? videor och programmering som var i luften från 1973-2009; reklam eller reklam; och musikvideor.

Vid planering för kinetisk typografi finns det några vanliga rörelser och beteenden.

  • Långsam rörelse eller snabbfilm
  • Sträcker eller krymper
  • Rörelse i bågar eller vågor som text rör sig längs krökta vägar
  • Förväntad handling, en sådan subtil rörelse före en skarp
  • Följ genom åtgärder som inträffar efter det att något annat har hänt
  • Sekundär åtgärd när texten flyttas på grund av något som händer med ett annat element i ramen

Resurser och handledning

Att sätta ihop en animerad typ kan vara lika enkelt som att skapa ett gif eller så komplicerat som att producera en musikvideo. Men det finns gott om bra - och mycket lätt att följa - handledning finns om du verkligen vill lära dig kinetisk typografiteknik.

Först rekommenderar vi att titta på vad som finns där och det oändliga antalet alternativ som finns tillgängliga för att skapa rörlig typ. (Kolla in kinetisk typografi på Tumblr för några roliga exempel.) Och börja sedan spela med gifs. Om du är bekväm med Adobe Photoshops animeringsverktyg kan du skapa något enkelt på några minuter. Därefter kanske du vill gå vidare till större projekt.

Dessutom finns det några verktyg som hjälper dig att skapa enkla textanimeringar i bråttom.

  • Kinetic Typography Engine
  • Kinetic Typography handledning av Jesse Rosten
  • Kinetic Typography Tutorial av Crooked Gremlins
  • Kinetic Typography Techniques With After Effects
  • Udemy Kinetic Typography kurs
  • Adobe TV: Learn Edge Animera video tutorials
  • MotionWorks Typ Animation Tips

Slutsats

Att använda kinetisk typografi kan vara ett roligt verktyg. Flyttbar typ kan lägga till effekter, känslomässig koppling och visuellt intresse för digitala och videoprojekt. Medan teknikerna kan ta lite tid att behärska, är det någonting som sannolikt ligger kvar för att stanna. (Tänk bara, designers har använt tekniken i någon form i mer än 50 år.)

Arbetar du för närvarande på projekt som använder kinetisk typografi? Hur bildar de sig? Dela dina tankar (och projektlänkar) med oss ​​i kommentarerna. Vi skulle gärna se vad du jobbar med.