From Xcode to App Store – the making of Desk Clock for iOS

deskclock

 

Check out Desk Clock on the App Store here: Desk Clock.

As some of you may know from either following my Twitter account (or my personal one) or if you are someone that just happens to know me, you know that over the past few months I’ve been hard at work on a new application for iPhone and iPad named Desk Clock. After discussing with Adam, our app review guru, about a review, we deemed it to be inappropriate as an obvious conflict of interest would arise, so instead, I’ve apter to give a look at what it was like developing Desk Clock, and letting you all know that it is now available if you want to show some support (and I read all the support emails personally, so feel free to send some support emails through the in-app support feature).

To be honest, Desk Clock wasn’t planned, and was built out of a project I started one day in Starbucks while waiting on my girlfriend to finish up a calculus late last semester. The internet in the Starbucks was some of the worst internet I had ever used, so I instead decided to open up Xcode and play around with a few ideas I had bouncing around in my head. That’s all that started it. If the internet had been better, Desk Clock probably wouldn’t be here. So I sat there running through some old projects that I had started previously (on a regular basis, I have 5-6 unfinished, eventually-to-be-deleted projects on my computer) and ran across some old code I had written back a year or two ago that was a clock app that just showed the time and that’s it. I took that idea, and thought, why not make an alarm clock application? That’s when Desk Clock started.

On a side note, the alarm idea was the original idea for Desk Clock, so much so that the Xcode project file is named AlarmClock.xcworkspace. So I set out to make an alarm clock application that would show the time, because I only thought it natural to show the time inside of an app that would be setting of alarms. The next thing I thought to do was show a label of whether or not the alarm was on so that you knew whether your alarm was set or not upon opening the app. By the time I had to leave Starbucks in order to pick up my girlfriend from her test, I had the clock working (including AM and PM), I had the day of the week working, I had the month and day of the month working, as well as some initial alarm stuff up and running. Here was an original screenshot:iPhone5sAt this point, the actual alarm didn’t work yet, Night Mode didn’t do anything (and would later become Low Power Mode), and the UI obviously didn’t include any weather information which, as you can see from the top screenshots, is included in the actual App Store release. It was basically just a clock, nothing more, and that’s actually when I decided Desk Clock should be the name of it, because I thought it could become something that could sit on your desk and show you some quick information at a glance, e.g. the date, time, and – eventually – the weather.

After I had this basic functionality built, I closed Xcode and it stayed closed for a while. The app, as I said, was built more out of boredom and wanting to see if I could build it than an actual project that would ever see public release. So it stayed dormant on my computer’s hard drive untouched for a few months, until I got another idea: night mode. I was using an app one day that had an auto night mode setting, and thought about why not make my own? So, I decided to add it on to Desk Clock, which was officially going by the name Desk Clock by that time. I fired up Xcode again, and started cracking down on a night mode setting. Within a few hours, I had a functioning night mode that would switch automatically at 8am and 8pm everyday. Then again, dormant.

A month went by, and I was working on random projects again and, sitting in my recent projects, was Desk Clock. I opened it up, and decided what should I do next? I thought, well, what about if a user wants to set this on their desk and have an easy way to decrease brightness completely? Easy: add a button. (Note: At this point, I still hadn’t gotten alarms working). So I started work on a button to lower brightness, and thought I’d name it Night Mode. Well, it hit me later down the road that this was a very unintuitive name, seeing as I had an actual night mode already, so, it became Low Power Mode later down the road. But what I did was I took the user’s current brightness, saved it, and changed the brightness to the lowest possible. Then, when the user wanted to go back to the normal view mode, I loaded the brightness from the previously saved brightness. I noticed a bug, though. When you exit the app, iOS is supposed to make your brightness what it was when you entered the app, but it never goes back. After some research, I realized I had stumbled upon a known bug, so if you experience this, I’m sorry! It’s Apple’s fault, not mine.

After this, I decided that this project is something I should spend some more time on. I started working on the app more, and even started a beta program with a few beta users (which have links in the About page of the app settings!). I took some suggestions from the beta testers, and started implementing those features.

A few of the features requested included: custom night mode times, multiple (read: working) alarms, and a portrait mode because, at this point, I had only built a landscape view. So I got to work. I got alarms working using some leftover code from a previous application I had worked on, so that was actually somewhat easy. Next, however, I started working on the other requests. Portrait mode was first. I created a view in Portrait view user Interface builder, and, used initWithFrame: I was able to get it all laid out in a manner that I really liked. But there was a major problem. Every time a button was pressed, the UI went all wonky for a second or two in the background. Why? This took a while for me to realize. Using Interface Builder was a bad idea, and not the way I should be going about things. Whenever the UI would glitch, I noticed after some observation that it was actually going to where it would be if I hadn’t manually set the frames and let IB take care of it. So what I ended up doing was completely removing the labels from IB and writing 99% of the UI through code, which was a new world for me. This project was a huge learning experience for many things, and that is mostly what this project became was a way for me to learn new aspects of programming for iOS.

After this, I had a new challenge to overcome: custom night mode times. I had used date pickers (the little thing that allows you to choose times and dates) before, but I hadn’t ever used them for something like this. I basically needed to decide what UI to use based on what time it was, which means checking the time every second (which I was already doing for the time, anyway), and then reacting on it. So what happened was I wrote many nested if statements that would check the time and then go through a few if statements in order to come to the conclusion of what mode the app should be in. This took me a few days of sitting down and working out the logic for until I came to a solution. Finally, I got it dropped in Xcode after writing up the logic for this separately to keep it organized while focusing on it, and it worked.

Next came something that wasn’t suggested but I had planned since early on, and that was weather. I searched around for how to do weather, as – just as with many parts of this app – it was something I hadn’t done before. I stumbled upon a site called OpenWeatherMap.org, which had a free to use API that was just great, and it gave me everything I wanted for the app to use. What I wanted to use was the current weather and temperature, which is something it provided. I started making notes of what I should do for weather settings, and it included doing a Fahrenheit and Celsius setting, as well as using your current location or a custom location (i.e. type your own city name). This proposed a new set of challenges, and it took probably the longest time out of any other feature on the app to get working.

Side note: I didn’t use any third party frameworks (for example, InAppSettingsKit) for my settings pages, it was all written from scratch and coded custom. Something I’m pretty proud of!

There was one more thing to do before it was done (well, at least version 1.0.0) – Themes. Themes were something that I had attempted in some side projects before and never really got working. But I was determined, and using everything I had learned through the other aspects of this application actually made thumbing it easy. So easy, that more themes are currently being designed and will be coming in updates to the app, so be sure to get in on it before those come! Themes all use custom picked colors by the person that was taking that math test at the beginning (you can find her Twitter account in the About settings of the page under The Team). To start, we decided on 6 themes that are named: Default, Gold, Warm, Cool, Spring, and Monochrome (of which Day Mode is my favorite). Something that is in the works is a theme for each iPhone 5c color to match it perfectly, so if you have a 5c, definitely be on the look out for that update.

After all of this, and a few rounds of beta testing, it was time to submit it to the App Store. I took my screenshots, wrote my description, and put it in the App Store review team’s hands, and waited…and waited…and waited…until finally, 8 days after submitting, it was deemed ready for sale. I scheduled the release for today, April 24th, and got ready for the release. That day has finally come.

This app works on iPad and iPhone, buy once and have it everywhere (universal). It is $1.99, and already has updates in the works. Check it out, and thank you for the support.

Desk Clock on the App Store. You can also tweet the support account here: @DeskClockApp.

 

Tags: , , , , , ,

  • Jason Burton

    I’m confused… I’m supposed to pay 2 dollars for basic features found on almost any electronic device? I already have something on my desk that tells time – my clock. I didn’t pay 400 dollars for my tablet only to repurpose it as something I can get for 5 dollars at K-Mart. Also, there are free apps that do this. Check out iDigital Desk Clock and Nightstand Central Free.

    • Kyle Frost

      To each their own.

    • Brandon Miranda

      He worked really hard on this and that is what you have to say? I for one say Congrats! As I am in the process of attempting to learn how to code for iOS and develop my own app! Honestly Kyle, I hope this app does amazing.

    • Brandon Miranda

      And show some respect. I’d like to see you develop an app even half as useful as this. I know I couldn’t.

      • Jason Burton

        Well I’m not an app developer, but if I were I’d probably make something a little more exciting than a clock. And I wouldn’t post a 2000+ word article about it’s development lol. Might as well write an article about watching paint dry. Sorry but that’s just my opinion.