GIPHY Text is Now Live in Our SDK and Chrome Extensions
March 18, 2021 by
GIPHY *literally* has a gazillion pieces of content indexed in its library. Just head over to the website GIPHY.com and type in your fav search terms to get a sense of the incredibly vast amount of results (GIFs, Stickers, Clips, etc.) that we surface.
However, sometimes what you want a GIF to say is quite specific and search results aren’t getting it exactly right. What if you could just make a GIF for those special occasions?
The new GIPHY Text feature is a creation tool for generating messages that pop, catch fire, or jiggle for whatever text you input — and it’s now available in the GIPHY SDK as well as GIPHY Chrome extensions!
We provide a few dozen different animated font styles, each paying homage to a different vintage internet aesthetic.
The Design
When designing the experience for delivering Text Stickers — inside the mobile SDK and Google Chrome Extensions — we stripped away anything that might slow down the communication process and aimed to deliver beautiful expressive text as quickly as possible inside the existing primary use case: GIPHY Search. Users simply search like they always have and a helpful suggestion will appear with search results. If they tap the Text Icon, they will see their search terms automatically animated and styled for them to share or they can continue creating elegantly from inside of the search bar.
We also designed a core set of text styles that would instantly add more than just trendy looks, but also emotional context to any phrase you like. You might want to send a flirty “hello” or perhaps a friendly “thanks” with a playful bounce. This is all possible using GIPHY Text Styles. Some styles may even look familiar as they borrow from text GIFs of the internet’s past. Some reference beloved movie and TV titles to help us all inject a little bit of personality into our presentations, web documents, emails, and chats.
Behind the Scenes
Under the hood, ThreeJS is the magic that brings your stylized text input to life! This nifty Javascript library encapsulates WebGL functionalities into a high-level API that gives developers a variety of ways to create animated 3D objects. At a glance, we created GIPHY Text by representing a font as a text geometry, and then give it the look by applying various colors, textures, lighting, and cameras. Finally, we animate it by adding different kinds of rotations, translations, and transformations. And we only scratched the surface on what ThreeJS can do, so check it out if you are curious!
Where can I find it?
While these “results” are dynamically generated on the fly, they still appear in the GIF grid just like regular ol’ search results, enabling users to animate their words through the standard GIPHY search experience they know and love.
Whether you’re building a chat app or a creation tool, these Text GIFs can add a new dimension to your users’ expression and communication.
They certainly have for us over here at GIPHY HQ, where we often use them to add a lil extra pizazz to our slack messages and emails.
GIPHY Text is available in our Chrome and Gmail extensions, apps like Prequel (and coming soon to byte!), and now in the SDK for developers to integrate.
Haven’t yet checked out the GIPHY SDK? Head over to our developer portal and github repos (iOS, Android) to get started. You can find details specific to GIPHY Text implementation in our documents too (iOS, Android).
p.s.
The coolest thing about working on the GIPHY SDK is getting to collaborate with developers all over the world building and growing different apps. As we continue to drop new features like GIPHY Text, we want to see what you think and learn how we can help power the best possible GIPHY experience in your app. No idea’s too wild! Drop an issue on Github or say hello @ developers@giphy.com.