We’ve open sourced Backboard, a motion-driven animation framework for Android. It’s built on top of Rebound, and makes it easier to animate views based on user interaction. We use Backboard in the Tumblr Android app to make our app more responsive and fun.
See more posts like this on Tumblr
#animation #open source #AndroidMore you might like
Open Sourcing Kanvas: Tumblr’s Media Editor and Camera
Today, Tumblr is releasing Kanvas, the Media Editor and Camera used in the Tumblr iOS app, as open-source!
https://github.com/tumblr/kanvas-ios
ALTKanvas is an open-source iOS library for adding effects, drawings, text, stickers, and making GIFs from existing media or the camera. It’s used by Tumblr for its camera, media editor, GIF maker, and media posting tool, and WordPress will be using it in the future too!
The project is licensed under the Mozilla Public License v2. Check out the Projects tab on GitHub for an idea of what we’re working on, and how you can contribute. The README is a good place to see Kanvas in action and add it to your own app. And if you’re interested, follow the project, as we’ll be posting more documentation about how Kanvas work and the history of the project.
Thanks to everyone who’s contributed to Kanvas over the years, and we’re excited to see what this new open-source & WordPress chapter brings.
ALTOpen Sourcing our Kubernetes Tools
At Tumblr, we are avid fans of Kubernetes. We have been using Kubernetes for all manner of workloads, like critical-path web requests handling for tumblr.com, background task executions like sending queued posts and push notifications, and scheduled jobs for spam detection and content moderation. Throughout our journey to move our 11 year old (almost 12! 🎂) platform to a container-native architecture, we have made innumerable changes to how our applications are designed and run. Inspired by a lot of existing Kubernetes APIs and best practices, we’re excited to share with the community some of the tools we’ve developed at Tumblr as our infrastructure has evolved to work with Kubernetes.
To help us integrate Kubernetes into our workflows, we have built a handful of tools of which we are open-sourcing three today! Each tool is a small, focused utility, designed to solve specific integration needs Tumblr had while migrating our workflows to Kubernetes. The tools were built to handle our needs internally, but we believe they are useful to the wider Kubernetes community.
omg asked:
Hi folks - long time tumblr user - love your work. Now that you are owned by Automattic - who have a long tradition of open source, I was wondering if you have any plans to open source the Tumblr iOS app?
Hello! Good question. We at Tumblr love open source as well! We don’t know yet if we’re going to open source anything like the iOS app. But if we do any new open sourcing work, we’ll post about it on here, so stay tuned.
Introducing Graywater for Android
Introducing Graywater, Tumblr’s framework for decomposing complex items in a RecyclerView list in order to improve scroll performance, reduce memory usage, and lay a foundation for a more composition-oriented approach to building lists. With Graywater, the app now scrolls faster and crashes less often, and it also gives us a solid foundation for building new features faster and better than before.
On screens that display posts, such as the dashboard, the Tumblr Android app customizes one adapter across multiple screens. This approach results in a complex adapter, and over time, our previous solution became difficult to manage and hard to reason about since there was no consistent place for screen-specific behavior.
Furthermore, each post type had its own layout and viewholder, which meant that once a user encountered a post type they hadn’t seen on that screen before, the entire post had to go through the inflate, layout, and draw process. Once offscreen, the post would take up large chunk of memory in the RecyclerView pool.
Graywater solves this by rendering only the parts of a post that are visible and reusing the parts of a post that appear in other posts, such as the header and footer. By breaking up a large post into smaller components, the UI thread has to do less on each scroll. Even though there are more view types, each individual view type is smaller, so memory usage is lower.
For example, a photoset post may be composed of ten photos, one after another. In the previous architecture, a photoset layout with headers and footers would be inflated and the photo views added in afterwards. If the viewholder is recycled and the next photoset post only has one photo, the extra photo views are discarded. With Graywater, each individual photo view is recycled separately, which allows RecyclerView to reuse the photo views that appeared earlier in the photoset.
This idea is based off of Facebook’s post on a faster news feed and Components for Android, which have been open-sourced as Litho.
Graywater differs from other RecyclerView libraries by being small (a single file!) and flexible enough to work within your model architecture. For libraries like Epoxy and Groupie to accomplish sub-item recycling, complex items like posts need to be decomposed into smaller viewmodels beforehand. For Litho to flatten view hierarchies and perform fine-grained recycling, existing XML layouts need to be converted to layout specs.
By converting to Graywater, we’ve been able to reduce OutOfMemory errors by 90% and dramatically improve scroll performance. It is now much easier to add new item types that are composed of preexisting post components. We have also migrated screen-specific logic to the screen itself by injecting the customized component into the adapter. By open-sourcing Graywater, we’re hoping the Android community will achieve similar performance and architecture gains, and we’re excited to hear what the community builds next!
Tumblr Hack Week, March 2022 Edition
It was Hack Week (more than just a day!) once again at Tumblr! A couple of times per year we grind everything to a halt and spend a week working on whatever we want and see how far we can get with our hacks. Since last time, we’ve launched the ability to have a Discord => Tumblr integration, we’re close to launching Twitch embed support, and custom logos are now possible in the mobile apps! And from a previous Hack Day, we’ve launched “Timestamps Everywhere” on web, and we’re working on rolling it out to the mobile apps very soon!
Here are some of the projects that got made for this last Hack Week. Some of these things you may also end up seeing on the site…
Interacting as a Sideblog/Secondary blog
@designpatternpirate put together a proof of concept for switching to a sideblog/secondary blog when liking or replying to posts. Using this hack, you’d be able to switch which of your blogs you’re “acting as” when hitting the like button or when replying to a post, to start. You’d even have separate Likes pages for each blog!
“One Year Ago” Dashboard Feed
André hacked together a feed which shows a portal backwards in time, to what the blogs you’re following were posting a year ago today:
Moving Android notification settings
On Android, Omar moved all of our notification settings out of the Tumblr app and into the Android OS level notifications settings view, like other apps do:
“Time for crab!” 🦀
@superchlorine hacked together a delightful button for the dashboard that summons crabs which scuttle across the page, and even comment on what they’re traipsing over:
As always, stay tuned to the @changes blog to see if any of these hacks make it on Tumblr for real!
One distinguishing feature of Automattic’s work culture is a team rotation, through which an individual can move from one team to another. A rotation can happen for a few reasons: to “try out” a new role and gain new skills, to backfill an understaffed team, or to cultivate cross-pollination and diversity across the company. Some rotations are several months long, while others may turn into a permanent team switch.
Tumblr, which is part of Automattic, is currently hiring data scientists and search engineers and machine learning engineers. Thanks to this system of rotations, last year we were able to fill a few of these positions, on the Tumblr Core Data Science team, internally. This team contributes to Tumblr recommendation systems, discovery feeds, targeted push notifications, user-interest profiling, and computational advertisement. Team members work on designing, developing, and maintaining large-scale machine learning algorithms, data pipelines, and backend services to connect users with the content they love. Our data infrastructure is built on top of open source big data frameworks such as Apache Spark and Scalding, orchestrated by Apache Airflow and with a PHP backend layer.
In this post, Adam and Vicki, two Automatticians who experienced a rotation onto the team, tell us about their work in data, their rotations, and being part of Automattic.
Very cool stuff! 👏 Give it a read.
Tumblr Hack Day, December 2022 Edition
Ah yes, it was Hack Day once again at Tumblr. A few times per year we slow down our normal work and spend a day (or sometimes a whole week) working on whatever we want and see how far we can get with our hacks. The main star of the last Hack Week was… pretty much all of them!
Here are some of the projects that got made for our most recent Hack Day earlier this month. Some of these things you may also end up seeing on the site…
@yi5h worked on a huge suite of “rewards” that folks on Tumblr could unlock by doing various things on the platform, such as reblogging, creating content, even just logging in! Maybe you could earn badges this way to put on your blog…
@straku hacked together a new way of viewing reblog trails. We commonly get feedback that reblog trails are difficult to understand, so styling them differently to make the information clearer is fun to try out!
Meanwhile, Evgeniy built a beautifully simple “Back to Top” button for the Android app, which does exactly what it sounds like: brings you back to the top of whatever feed you’re currently viewing. No more scrolling, scrolling, scrolling — just one tap!
As always, stay tuned to the @changes blog to see if any of these hacks make it on Tumblr for real!
StreamBuilder: our open-source framework for powering your dashboard.
Today, we’re abnormally jazzed to announce that we’re open-sourcing the custom framework we built to power your dashboard on Tumblr. We call it StreamBuilder, and we’ve been using it for many years.
First things first. What is open-sourcing? Open sourcing is a decentralized software development model that encourages open collaboration. In more accessible language, it is any program whose source code is made available for use or modification as users or other developers see fit.
What, then, is StreamBuilder? Well, every time you hit your Following feed, or For You, or search results, a blog’s posts, a list of tagged posts, or even check out blog recommendations, you’re using this framework under the hood. If you want to dive into the code, check it out here on GitHub!
StreamBuilder has a lot going on. The primary architecture centers around “streams” of content: whether posts from a blog, a list of blogs you’re following, posts using a specific tag, or posts relating to a search. These are separate kinds of streams, which can be mixed together, filtered based on certain criteria, ranked for relevancy or engagement likelihood, and more.
On your Tumblr dashboard today you can see how there are posts from blogs you follow, mixed with posts from tags you follow, mixed with blog recommendations. Each of those is a separate stream, with its own logic, but sharing this same framework. We inject those recommendations at certain intervals, filter posts based on who you’re blocking, and rank the posts for relevancy if you have “Best stuff first” enabled. Those are all examples of the functionality StreamBuilder affords for us.
So, what’s included in the box?
- The full framework library of code that we use today, on Tumblr, to power almost every feed of content you see on the platform.
- A YAML syntax for composing streams of content, and how to filter, inject, and rank them.
- Abstractions for programmatically composing, filtering, ranking, injecting, and debugging streams.
- Abstractions for composing streams together—such as with carousels, for streams-within-streams.
- An abstraction for cursor-based pagination for complex stream templates.
- Unit tests covering the public interface for the library and most of the underlying code.
What’s still to come
- Documentation. We have a lot to migrate from our own internal tools and put in here!
- More example stream templates and example implementations of different common streams.
If you have questions, please check out the code and file an issue there.
Tumblr Hack Day, March 2023 Edition
Well well well, it was Hack Day once again at Tumblr. A few times per year we slow down our normal work and spend a day (or sometimes a whole week) working on whatever we want and see how far we can get with our hacks. Here are some of the projects that got made for our most recent Hack Day earlier this month. Some of these things you may also end up seeing on the site…
Wesley worked on adding the ability to translate the text content of posts using LibreTranslate, which works really well! We know this is a big pain point for folks who use Tumblr around the world, so we’re excited to keep experimenting with this.
Omar built a Feature Wishlist for the Android app, which has different lists for community-driven and staff-driven feature ideas, with the ability to upvote which ones you’d like the most! Really cool, we’re trying to think of ways like this to expand what we can do to collaborate with the community, like we already do with the @wip and @changes blogs.
One thing that’s been bugging @blowery forever is trying to figure out who exactly added the tags when you’re viewing a reblog of a post. It can be hard to tell whether the person reblogging it added the tags, or if they’re meant to come from the reblogged post. To help distinguish this, they hacked together putting the reblogger’s avatar next to the tags they added at the bottom of their reblog!
@straku hacked together a more modern look for our 1:1 messaging on Tumblr, bringing the message bubbles into a left-and-right back-and-forth format, and using some better colors. Looks a lot snazzier!
As always, stay tuned to the @changes blog to see if any of these hacks make it on Tumblr for real!
Tumblr Hack Day, September 2024 Edition
Once again it was Hack Day at Tumblr! You’ve probably seen one of these posts before. A couple of times per year we slow down our normal work and spend a day working on scratching a personal itch or features we want as user and see how far we can get with our hacks. One thing from the last Hack Week in January made it out: new default blog avatars!
Here are some of the projects that got built for our most recent Hack Day in September. Some of these things you may also end up seeing on the site… and one of them isn’t included here because it’ll likely be a fun Halloween surprise. 👻
Advanced search operators
Instead of telling you about this here, we have the extreme pleasure of telling you that this already launched! Read all about it over on the Changes blog. Instead, what we can preview here are some potential new interface elements for these advanced search options, now that we have them thanks to @lesianlen:
“Live” engagements on posts
There are many thousands of reactions, likes, and reblogs happening on Tumblr every second. Right now you can only really “see” these happen if you are frantically refreshing your feed (which, we know, some of you do). Wouldn’t it be neat if the note count, reactions, etc, all update automatically as you scroll your favorite feed (or many feeds at once with Patio)? Check it out this hack from @leogcrespo:
Communities activity tracker
Likewise, some of our beta testing Communities are extremely active, with new members, comments, and reactions flying around. Right now we don’t have a way to show those actions, as they happen, inside the community, but we know we’ll need something like this. @yi5h hacked together a sidebar widget “activity tracker” that shows recent activity happening inside a community in near-real-time:
As always, stay tuned to the @changes blog to see if any of these hacks make it on Tumblr for real! Especially the aforementioned-but-as-yet-unrevealed Halloween surprise…