How I made my iPhone user experience better

I’ve been an iPhone user for 6 years, and a jailbreaker for as long. Being a jailbreak user through the years has really been awesome. You want your iPad to be a Nintendo 64 Emulator that you can play with your Playstation controller? You go right ahead. You want your phone to scream when you drop it like the XKCD phone? Of course.

I’ve heard no Medium article is complete without a GIF

For those uninitiated about what a Jailbreak is, it’s basically a tool to grant the user write access to the root of the phones file system. What’s so great about this is that it lets the user really own their phone and customize their device however they wish. Along with the jailbreak is the jailbreak community, with a lot of great developers contributing to the community by releasing tweaks that in some way alter the iOS experience for the user.

Since I’ve started studying Interaction and Design 4 years ago I’ve looked at my phone and the tools available to me to customize it differently. Here’s three problems I’ve found with iOS and what I did using the jailbreak to improve the usability of my iPhone.

Animation

Animations are a great tool help the user construct mental maps of spatial information in the context of an interface. For example, when opening an application:

1. User need: To open an app
2. Action: User taps on an app
3. Effect: They’re starting/opening the application they’ve tapped
4. Animation: The apps interface extends from the app they’ve tapped to cover the entire screen
5. Context change indicated by animation: They are leaving the springboard and entering the application

The animation successfully indicate to the user that their need is being fulfilled, that they’ve transition from one spatial context to another.

And similarly when closing an application:

1. User need: To exit an app they’ve previously opened from the springboard
2. Action: User taps on the Home button
3. Effect: They’re exiting the application and entering the springboard
4. Animation: The applications interface zoom back into the app icon they tapped when they wanted to open the app
5. Context change indicated by animation: They are leaving the application and entering the springboard

The closing animation, zooming out, is the same animation as opening an app, zoom in, but reversed. This is also an indication that their action puts them back into a context that they’ve previously been in.

Problem

The animations are sloooooow.

The time for the animation to finish when opening an application is approximately 350 ms, but humans only need about 200 ms to perceive a change of state through animation.

Just by increasing the animation speed a little bit, the user will still have the time to perceive the contextual change from the effect given by the animation, but also they don’t need to wait for the animation as long to finish before proceeding to use their phone. Also, if the animation finishes faster, other information will be available sooner (The position of the next app they want to open, for example). Faster animations may also give the perception that the performance of the phone is greater than before.

The Remedy

Increase the speed of all animations system wide.

Prescription (or tweak list)

- NoSlowAnimations set to about 0.5 or faster

Physical reachability

When Apple were only doing 3.5"-4" inch screens and other vendors were boasting their mobile lineup with larger phones with larger screens people would ask me why I preffered the screen to, for example, a 5" screen, I would just show this commercial by Apple.

Problem

The screen area easily accessible by my right thumb

This has not been the case though since they released their iPhone 6 lineup to compete with the other vendors larger screens. Most mobile users use their phone with one hand, so if you have an iPhone 6/+ and suffer from a short thumb (like me) you have to shift how you hold your phone to be able to reach the elements on the top of the screen. Apple tried to combat this problem by introducing the Reachability feature; tapping the finger on the finger print sensor twice would lower the interface so that the elements on the top of the screen would be more accessible.

I rarely use this feature, and the reason why is also the same reason why I never use 3D-touch; There’s no affordance. How would you possible know that tapping the fingerprint sensor would bring down the interface, if someone/Apple didn’t tell you about this feature? The action to trigger Reachability doesn’t in any way indicate to the user what’s going to happen. Because of the lack of affordance I just forget that it’s there.

Also, when you’ve triggered Reachability you can only perform one action on the screen before it returns to it’s initial state. This means that you might have to trigger Reachability multiple times in succession to access multiple items in the top of the interface, greatly increasing the number of physical actions the user has to take to fulfill their need.

The remedy

There are a couple of things that you can do to help alleviate this problem. One simple thing would be to just add another an application that you use often to the dock, one of the most reachable position for the thumb. This will give us an extra application to interface with on every springboard page which is easily accessible.

Another thing to help solve this problem is to bring all applications closer to the thumb on the springboard to make them more reachable. This icon layout is also consistent with this research that suggests that “subjective satisfaction score (the pressing convenience) tended to be higher in the center region”.

There’s a trade off for this though, since we won’t be able to fit as many application on one springboard page, and now we have an area of the springboard that’s empty. You could also use something like Upscale to increase the resolution of the phone to fit another row of icons in basically the same area. You could just leave it now as is and a more visible background image (if you like that), but if we want to make use of this area we can look at other vendors and see how they’ve solved this problem.

Interface for a HTC Phone

Looking the vendors equivalent of the springboard we can see that they usually have some kind of widget displaying information on the upper part, like the weather or a calendar, with application icons on the lower part. The user doesn’t necessarily need to physically interface with the widget to retrieve the information from it, so positioning it at the top of the springboard makes sense. I don’t personally fancy widgets, but there’s a lot of widgets available on Cydia, the jailbreakers “App store”.

Prescription (or tweak list)

• BetterFiveIconDock for an extra dock app
• Upscale to increase the resolution of the iphone
• Boxy to reposition applications closer to thumb
• iWidget & LockHTML4 for Springboard widgets

Camera

I really enjoy taking pictures with my iPhone. It’s quick to focus and it’s easy enough to get a good picture. The shutter button on the screen is easily accessible by the thumb, and the list of available camera modes on the bottom bar can easily be swiped through or you can just simply tap on the camera mode you want.

Problem

The view finder on the screen does not represent what the actual image is going to contain. The viewfinder is roughly 17 : 22, but the actual image will be about 17 : 30. This missing parts in the viewfinder is obfuscated by the bottom and top bar.

[EDIT]: It has come to my attention that this is not actually the case, but I’ll leave it in anyway as I can really recommend the tweak I’ve listed as a “remedy”.

Left: What the camera view port shows (17 : 22). Right: The actual picture taken (17 : 30)

The remedy

We can’t just hide the top and bottom bar, since a lot of important elements needs to be visible to the user. What we can do is decrease the opacity of the top and bottom bar. By doing this, the user will know that the final dimensions of their captured picture, and the user can take this into account when taking the picture.

Camera interface with decreased opacity

Prescription (or tweak list)

• TransparentCameraBar with about 70% transparency

Final words

These are just a couple of things I’ve done with my jailbroken phone, but these tweaks are what improved my user experience the most. If you’re curious about jailbreaking, head over to /r/jailbreak and join the community!

Agree or disagree with me? Bug me about it on twitter.

Subscribe to The UX Blog