Pull-to-refresh

Pull-to-refresh is a touchscreen gesture that consists of touching the screen of a computing device with a finger or pressing a button on a pointing device, dragging the screen downward with the finger or pointing device, and then releasing it, as a signal to the application to refresh the contents of the screen.

The pull-to-refresh gesture first appeared in the Tweetie mobile application developed by Loren Brichter. Brichter developed Tweetie, an iOS application for Twitter, as a personal project in 2008 after he quit his job at Apple Inc. in 2007.

Motivation

While Brichter was initially developing Tweetie, he wanted to add a refresh function to the application. Regarding other mobile applications of that time, he said “They all had to find a spot and just cram a refresh button somewhere. Usually in one of the corners in a toolbar bordering a scrollable list. That was the most valuable real estate for navigation and action UI, so using it up for something as mundane as a refresh button just seemed wasteful.”^[1] Brichter thus decided to create a different method of refreshing such that the valuable corner space could be utilized for something else. Although he initially planned to create a refresh mechanism that follows Apple’s platform conventions, Brichter’s work with pull-to-refresh resulted in a novel interaction new to Apple’s platform at the time.^[2]

Creation

In the initial design of Tweetie’s refresh mechanism, Brichter placed a refresh button at the top of the Tweet list because users typically expected new tweets to appear at the top of the page. This design rolled out in Tweetie Version 1.0. Although it provided users with the ability to refresh their Twitter feed, the button utilized valuable screen real estate that Brichter wanted to use for other features. Brichter said “Tweetie 1.0 (with the refresh button at the top of the list) was so close to pull-to-refresh in hindsight, and it wasn’t much of a leap to go from a button to a gesture.”^[1]

Iterations

Brichter experimented with two primary iterations of pull-to-refresh before releasing the final version. In the first iteration, users triggered the refresh when they scrolled across an invisible threshold on the screen. However, in this iteration there was no visual feedback that signaled to users that a refresh was occurring. Brichter believed it necessary to include provide users with visual feedback, so the second and final iteration of pull to refresh added visual feedback when refreshing so users could better understand the gesture. This final iteration also included text alerting users that if the top of the page is pulled beyond a threshold and subsequently released, a refresh would occur. Brichter included this description text because he felt that since the gesture presented a new interaction technique that most users likely have not seen before, the purpose of the gesture had to be explicitly stated for users to understand its functionality. These two iterations of pull to refresh were created in a single afternoon with no user testing. Brichter states that he manually tested the iterations and the invisible threshold of the gesture until it felt “right” - that the threshold cannot be too small causing people to accidentally trigger the gesture, but it also cannot be too big causing it to be difficult for users to activate.^[1][2]

Following its initial release in Tweetie 2.0, further evolutions of the pull-to-refresh design was done by the design community as interaction designers applied different stylistic takes to the technique. Brichter currently does not have any plans to continue work on pull-to-refresh.^[1]

Mechanism

Steps involved in the original version of pull-to-refresh as released in Tweetie 2.0: User pulls down on the screen and visual feedback appears at the top of the list showing a down arrow and text displaying the message “Pull down to Refresh”. If the user releases before reaching the refresh threshold, the refresh aborts and visual feedback disappears. If the user pulls down enough to reach the refresh threshold, new visual feedback appears at the top of the screen showing an up arrow and text displaying the message “Release to Refresh”. Once the user releases, the refresh will occur.

Critiques

Upon its initial release, pull-to-refresh received positive reviews from Tweetie users.^[1] Users praised the mechanism for its convenience and intuitive nature. Aside from general users, pull-to-refresh was also well received by the overall interaction design community. Designer Tim Van Damme reportedly emailed Brichter following the release of pull-to-refresh, saying “Thanks to you, I just tried to refresh my inbox by pulling the list down and releasing it. I hate it when you do things better than Apple.”^[1] Other interaction designers expressed similarly positive sentiments regarding the technique.

A few years following its release, concerns regarding the applicability of Pull-To-Refresh, in light of recent technological advances, began to surface. Online articles and publications critiquing the technique started to emerge as exemplified by an article published by Co.Design in late 2013 titled “Why The Pull To Refresh Gesture Must Die”.^[3] The article, written by Austin Carr, states that given smartphones have become fast and strong enough to auto-refresh, the pull-to-refresh technique has now become outmoded - essentially an unnecessary step. However, since the gesture has now become so universal that users implicitly expect it to be part of the mobile app experience, it is hard for developers to move beyond it. The article reports that even Britcher agrees and believes that it is time for the gesture to evolve. Brichter is quoted in the article saying "The fact that people still call it ‘pull-to-refresh’ bothers me—using it just for refreshing is limiting and makes it obsolete...I like the idea of ‘pull-to-do-action’.” The article concludes by stating that rather than being used exclusively for refreshing, vertical swipe interactions should now evolve to perform other actions, thus giving birth to a new style of app interactions. Following the publication of said article, interaction designers have responded by posting online their own perspectives regarding the continued applicability of pull-to-refresh.^[4]

References