Ångström 

How accidental promises hurt reputation 

With Alex Babaev we have a policy of no comments about the future of Ångström. We want the freedom of being able to change our minds any time. And we don’t want to look like jerks who don’t keep promises. So whenever somebody asks about our plans or requests a feature, we just thank them and explain that we do not pre-announce things.

About a year ago I got this email message from a user:

Best converter ever, I immediately deleted all the others, yours has the best UI. Really nice would be a German translation. Can I help you with that? Should be pretty easy, just give me a list with variables.

We had Ångström 1.1 in the App Store and were waiting for 1.2 to get approved. We also had the German translation done by that moment and we were planning to ship it in version 1.3. So something broke in my head that day and I responded:

We’ve started the work on German translation recently. We cannot promise anything so far, but it is likely to be added in an update (not in 1.2 though). Thank you for being ready to help, we will drop you a line if we have questions.

And thank you for the kind words!

I didn’t say it had been done, I said we’d started the work on it. I even said “We cannot promise anything”! But that’s not how things work. As I learned later, I promised to ship German translation in 1.3 in that email. In March, I got another message from that same person:

I was a little sad, there was no German translation in the 1.3 update.

I, too, was sad. Why didn’t we ship German in 1.3? While it was ready for version 1.2, the translation became a little bit obsolete when we finished work on 1.3. We added many new features which were not covered by the translation we had. We could delay the release of 1.3 to update the translation, but we decided that it was more important to ship the actual features. And so we did.

In versions 1.4 and 1.5 Ångström and our German translation further diverged. We just couldn’t find time to update it, because other features felt more important. In August, I got another message from the person:

A year ago I asked about German translation. I even offered my help. You stated, your team already started working on it, so I bought the damn thing. A year later… nothing happened. Thanks for lying to me.

This was not a message I enjoyed reading. I almost started a reply saying that actually I had not promised anything. So technically I did not lie! But we are not in court, and what matters is not what I wrote in that first message, but what my words felt like. And they really felt like we were going to add the German translation in 1.3.

Ångström in German

We finally shipped German with version 1.6 a week ago, more than a year after that letter where I promised in it 1.3. I am sorry about that.

Don’t repeat my mistake. Don’t say anything about the future of your product except that you don’t want to say anything about it.

   
2015   Ångström

Ångström: onboarding and light redesign 

We’ve updated Ångström to version 1.6.

First, we’ve lightly redesigned the app. The numeric keyboard got full width and there’s now a gear icon to go to the About screen (few people could find it before). Everything looks twice as cool now, especially if you have iOS 9 with the San Francisco font. Before and now:

Ångström 1.6

Check out how the gear spins when you pull the About screen from the left with your finger.

Better onboarding. We explain to the new users what they are supposed to do:

Ångström 1.6

Before, some people did not understand that they could just type what they thought, and Ångström would get it. They were trained by other converters to first set stuff up in various menus, but could not find anything like that in Ångström.

When converting local time we now find cities by timezone codes (like PST or CET). New units: gallon per minute, gallon per hour, kilopascal, megapascal, technical atmosphere and millimetre of water. We also now understand the words “quid” and “buck”.

Improved voice recognition, much improved VoiceOver support. Added German localization (special thanks to Pascal Kreil and Dmitri Evmenov).

If you are not yet using Ångström, you should:

Download in the App Store for free

The app is free, but you can buy an extended unit pack with an In-App Purchase. Even if you don’t really need it, you can buy it as a way to say that you like Ångström.

iOS 9 will get released soon and everyone will be able to enjoy the San Francisco font.

   
2015   Ångström

Ångström: the Watch and dictation 

The new version of Ångström codenamed Plato is available. We now support the Apple Watch. You can talk to your Watch about all the stuff related to unit, currency or timezone conversion. A picture from our lab:

Ångström: the Watch and dictation

We don’t have a Watch, so it’s all theory. If you do, let us know what you think.

For this to work we’ve improved dictation significantly. This works on the phones, too. Press the mic button on the keyboard to try the magic.

Say “five kilograms in pounds” or “seventy-eight Fahrenheit in Celsius”. Ask a question: “What time is it in San-Francisco when it’s five o’clock in London”. Or even: “What time is it now in Beijing” (we had to support this for the watch).

We also no longer automatically paste stuff from pasteboard (this confused many people). Tap the from value to get the Paste option. We will show the popup automatically if there’s anything new in the pasteboard when you open the app.

If you are not yet using Ångström, you should:

Download in the App Store for free

   
2015   Ångström

Autocomplete with and without selection 

The inventors of classical autocomplete cleverly used text selection to denote the suggested word remainder:

Autocomplete with selection

As you type, you overwrite the selection and the system updates the suggestion. If you press Enter, the whole text is submitted. If you press the right arrow, the suggestion remains in the field, unselected, and you can refine the input before submitting. This is how selection has always worked. There is no need to modify its behaviour for the suggested text.

This solution may seem obvious, but I’m not sure it came easy. At least, my first call would be to overload the text input with a support for a special kind of text: the suggestion. It would take an aha moment to figure out you could make do without it.

Still, recently it became common to show the suggestion as just grey text:

Autocomplete without a selection

This design is better aesthetically, but is not as elegant logically since it does indeed add an extra kind of text. It is also unclear whether the suggested part will be submitted with Enter or not.

One popular Russian classifieds website uses this design and frustrates me with its search. Say you type “sno” and it suggests “wboard” with grey text. You press Enter — and get no results for “sno”. The classical autocomplete would not do that to you.

It takes years for controls’ behavior to settle and become standard. So far, the implementations of this modern autocomplete design vary. But I suspect that you can recreate the classical behavior by just changing the selected text styles with CSS.

Alex Babaev, with whom we make Ångström, suggested that we switch to the modern autocomplete design, and so we did In a recent update:

Autocomplete in Ångström

Works the same, looks better.

   
2015   Ångström   user interface

Ångström: improvements to input and iPhones 6 support 

We’ve updated Ångström to version 1.4 for you:

This is a clean-up update after not-so-smooth 1.3. We didn’t even come up with a codename: were too busy fixing everything that was broken.

Unfortunately, we had to remove the Today widget. We rushed to add it in the fall, but had really hard time making it fast and reliable. We don’t want gimmicks in our app, so for now, no widget. We will get it back as soon as we figure out how to make it up to our standards. Sorry.

Also: numerous improvements to input. When changing a unit from “meters” to “Moscow time”, 3,57 would turn into 3:34 before, will now be 3:57 (tried to be smart, but it was useless). 357msk will also be automatically be treated as 3:57 msk. You can also type 007 without a decimal point now, it will be interpreted as 0,07 or 0:07 depending on the unit selected. Less taps, we like that.

People with large iPhones 6 and 6 Plus, we will use your screen real estate better now.

The Ukrainian currency, Hryvnya is now included in a free unit pack.

If you are not yet using Ångström, you should:

Download in the App Store for free

   
2015   Ångström

Ångström: convert time and time zones 

The new version of Ångström codenamed Greenwich is now available. Everyone can now convert hours to seconds, weeks to minutes etc. Paid users also get timezone conversion:

Ångström: convert time and time zones

What time is in New York when it’s five o’clock in London? Now it is as easy as typing “5lo”. We know when and where daylight savings time is in effect.

Also, we’ve finally done the rounded corners right:

We’ve finally done the rounded corners right in Ångström

Ah, so much better now! It took effort on Alex’s side to make this work fast and reliably on all supported devices.

We’ve added more currency symbols, including Turkish lira, Cambodian riel and Armenian dram (by the way, we’ve always had Bitcoin):

We’ve added more currency symbols to Ångström

And finally, we do a little bit better job explaining what you get with an In-App Purchase. Instead of listing unit symbols, we spell out the whole names.

Thanks to Federico Viticci of Macstories for a great recent review:

The result is an incredibly fast conversion process that only takes a few taps and doesn’t require you to scroll long lists or bookmark favorites for quick access. For me, typical usage of Ångström goes like this: I open the app, type a number, insert the first letter of a unit, and I’m done.

If you are not yet using Ångström, you should:

Download in the App Store for free

Stay tuned.

   
2014   Ångström   projects

Ångström: the update animation 

One of the objectives of the design of Ångström was getting the result as fast as possible. But we’ve confronted a problem with currencies: getting the current rates takes time.

We didn’t want to give up on immediate feedback. So we decided to show the result with the rates we have locally and use an approximate equality sign to hint at it:

Ångström: the update animation

While the currency rates were updated, a standard spinner spun in the phone’s statusbar. When the new rates were downloaded, we updated the result and replaced the sign with the strict equality one.

And then an idea came to our minds to make the process more fun: instead of showing a boring spinner, we have animated our equality sign. The wave oscillates during update, and when the data is loaded, its amplitude gradually decreases to zero:

Ångström: the update animation

This is how it shipped.

We like it how one element performs two functions: shows that the data is approximate and shows that the new data is coming. You don’t see this in the app often, as we periodically update the rates in the background, but it still appears sometimes if you are lucky.

   
2014   Ångström   design   user interface

Ångström: no favorites 

With Ångström, we were thinking about a way to make the units you use most, accessible more easily.

The obvious idea would be to implement favorites. The user finds a unit he wants to convert, then taps a star. The starred units get into a special list. If a unit gets out of favour, you tap it again to remove it from the list.

But there is a problem. When you’ve got your result, you don’t want to think about adding the unit to a special list to simplify the task in the future. You want to get on with your life. Adding a unit to favorites would require discipline which most people don’t have: few people bother adding websites to Bookmarks, they just google them again and again. Nobody wants to manage their unit converter. User interface is evil.

We focused on the idea of maintaining conversion history and learning the user’s habits.

Ångström: no favourites

Here are the things we do:

  1. When you open the app, we use the units from the last time. If you always convert the same thing, you will never need to enter the units.
  2. If you press space after entering the value, we show the conversion history (see the screenshot above). If you always convert several of the same things, you will be able to see all the possible conversion results at once.
  3. If you last used some unit long ago and had to actually type it again, we at least remember what you converted it to and use that.

These features let us be as helpful as we can without making the user babysit the app.

   
2014   Ångström   design

Ångström Style System for Cocoa 

While developing Ångström, the unit converter for the iPhone (check it out!), Alex Babaev and I have come up with the Ångström Style System.

ÅSS (hey, why not) is a JSON-driven styling engine for Cocoa with Dropbox synchronization and shake-to-refresh. It is a great way to separate the code of the app from its look and feel. It helped me try out different aspects of the color scheme, the fonts, the spacings and, most importantly the animations, without making Alex rebuild the app every time I wanted to change something.

Playing with the text caret

One of the many things we were obsessing over in Ångström was the text caret animation:

This is an animated gif, make sure to download the app and look at the real thing.

I wanted the caret to stick out much below and above the text. I wanted it to move like an elastic and bouncy string (whatever that is). I wanted to make it stretch and squeeze, not just blink. There was no way I could explain this in technical terms to Alex. How far the line should stretch? How fast the animations should be? Who knows. I needed a way to play with all the parameters until it felt right.

So I wrote Alex a letter explaining my idea in vague terms. I asked for a way to control the length and the opacity of both the long and the short states of the caret and the transition times between them. After having played with this parameters for some time I figured out I could not make the caret behave exactly as I wanted. Six variables were not enough. We have gradually added the variables for animation easing, the delays and the caret width.

This is the final “stylesheet” for the caret, after hours of tweaking:

   
"cursor": {
  "showTime": 0.2,
  "hideTime": 0.2,

  "color": "@colors.textNumberColor",

  "period12": 0.4,
  "timingType12": "linear",

  "period21": 0.2,
  "timingType21": "easeOut",

  "height1": 48.0,
  "width1": 2.0,
  "delay1": 0.3,
  "alpha1": 1.0,

  "height2": 78.0,
  "width2": 1.0,
  "delay2": 0.1,
  "alpha2": 0.33
},

This fragment is actually about 3% of the whole Ångström’s stylesheet.

Dropbox sync and shake-to-refresh

The two things that make ÅSS particularly awesome are Dropbox sync and shake-to-refresh.

Moving the style variables from the code to an external file is a useful idea all by itself: I could have been playing with the parameters and rebuilding the app having no clue about Objective-C. As far as I understand, this is how Brent Simmons’s DB5 works.

But we wanted to make ÅSS a real pleasure to use (no pun intended), eliminating the need not only to rebuild, but even to restart the app. Here is how the process of refining something looked for me thanks to ÅSS:

  1. Open the app on my iPhone and go to the screen I want to adjust.
  2. Open the app’s ÅSS stylesheet from the Dropbox folder with Sublime Text on my Mac.
  3. Change the parameters in the file and save it.
  4. Shake my iPhone to see the change immediately.

So this is literally live tuning of a running app.

There is a different approach to styling: put sliders with the parameters to the Settings app during development. While this may look nice, we think it is very counter-productive. You don’t want to be constantly switching between the app you are designing and the Settings app. You don’t want to be scrolling through tens or hundreds of variables on the iPhone screen. You don’t want to struggle entering a color’s #rrggbb value on the iPhone keyboard. Sublime Text on a computer synced with the iPhone via Dropbox works so much better.

Alex has written a post on the internals of the system, check it out. It explains the architecture and features some code examples.

   
2014   Ångström   design   programming

Ångström, the unit and currency converter 

My friend and a great iOS developer Alex Babaev approached me with an idea to make a unit converter for the iPhone. What? Aren’t there hundreds of them on the App Store already? But after a short discussion it became clear to me that none of the ones that existed were good.

All the converters had stupid menus with categories and icons, as if the designers were thinking about a nice Dribble shots instead of the utility of their apps. By the time you make it through the user interface and set it up for the conversion, you forget what you wanted to convert in the first place.

So we did it our way. Our product is called Ångström:

We have started from scratch. You have a number in your head, you want it converted stat. You do not want an endless list of categories distracting you.

We ask you for a number and strive to give you the answer with as little taps as possible. Ideally, with zero taps. That is why we check out your clipboard first. We use the units from the previous convertion before you change them. We show you your unit history before you have started typing the unit. We try to guess the target unit i. e. we know that it is natural to convert feet to meters, but miles to kilometers. We learn what you convert to make better guesses over time. We keep currency rates updated, but show you approximate values when offline. We support alternative spelling of many units.

The version 1.1 has just been released. We invite you to have a look at what we have done. Ångström has been “In Review” for five days. Presumably, Apple employees were playing with the equals sign and just could not stop.

Yep, we have had lots of fun with the animations and transitions. If nothing else, this alone is a good reason to test drive Ångström. Every tap is welcome. And if you don’t feel like tapping, you can just run the app and enjoy our text caret animation for hours. For some reason, I, personally, particularly love it.

Download in the App Store for free

The free version includes most units for daily use. An advanced unit pack is available as an In-App Purchase.

   
2014   Ångström   design   projects