How we built an Android / iOS watch app in one day

Mobile Team Innovation Day — Jan ‘18

By Connie & Magnus

Introduction

As two software engineers at comparethemarket.com we have the privilege to spend one day a month taking part in what we call a team Innovation Day. So what does this mean? This means we have a whole day dedicated to exploring a new area within programming with the goal of delivering an MVP by the end of the day. We can choose to work individually or in teams and it doesn’t even have to be work related! Pretty awesome, right?

The innovations so far have involved everything from machine learning to building Alexa skills, but technically it could be anything! So in January, four of us mobile engineers decided to build a watch app. As a team we work on our app Meerkat Movies, which allows our members to plan their cinema experience and get 2 For 1 cinema tickets — so naturally we decided to create a watch app that displays the 2 For 1 voucher code.

We saw this as a great opportunity to explore the wearable side of mobile, something none of us had any experience doing. We paired up in teams with the aim of creating an Android Wear and Apple watch app respectively.

Meerkat Movies

How we did it

Planning (9.15am): We started the day with researching the topic and explored the learning materials and resources available. We also identified potential barriers to our approach, for example that we didn’t have an Android watch to test on. Luckily, we found that there was plenty of tutorials out there and some guidance on how to overcome our obstacles.

Kick off (10.00am): We had an initial kickoff , where we shared our approach with the team which allowed us to raise questions and ask for support if needed.

Challenges

We progressed well throughout the day considering we were working on a completely new area of technology which we had previously not explored, but we did come across a number of challenges.

• Loading indicator (iOS): In order to display our Meerkat Movies voucher code, we needed a loading indicator — however Apple doesn’t provide these so we had to make our own animation. To solve this, we worked with our UX Designer to create four images of three dots to use.

The iOS Watch Loading Indicator

• No Android watch: On the Android side, we lacked a watch to test on which meant we had to use the emulator instead. This proved to be trickier than expected to set up with a real device, however we ended up finding a solution through a bit of troubleshooting and research.
• Time pressure: As developers we are used to writing clean, scalable and testable code and we found it difficult to do this under the time pressure. We ended up having to make some compromises on the quality of our code, however seeing as the purpose was to deliver an MVP it didn’t really matter. In fact, we enjoyed how quickly we progressed with the task!

Showcase (4.30pm):
Despite rushing towards the end, we finished both watch apps in time for the showcase. At the showcase, we presented our innovations to the team and were pleased to find that they were very impressed with the result!

The results

Apple Watch App

Android Wear App

Learnings

All the researching, programming and learning left us exhausted at the end of the day, but we had a lot new knowledge to take away. In our retro we reflected on what we learnt and it came down to the following:

• Time pressure can be a good thing: Due to the time pressure, we didn’t get stuck on something for too long and kept exploring new solutions and tackling problems from different angles.
• Out of our comfort zone: Spending a day learning something we had no previous experience working on was a fantastic experience. We felt really proud of ourselves to have learnt something so quickly and having something to show for at the end of the day.
• Broaden our knowledge: As mobile engineers we naturally specialise in a specific platform, but it’s important to not forget about all the exciting technologies, programming languages and potential learning opportunities out there. At the end of the day, we felt inspired to try out more new exciting ideas for upcoming innovations day!

What’s next?
The next step is to make a V2 of the watch app, which will involve adding in more features, improving the code and writing some tests.

Hope you enjoyed this article! Thank you for reading!

Connie & Magnus