My way to App Store

The Idea to build an app for climbers born during my first attempts in bouldering. This was a really crazy and I immediately loved climbing. I decided why not to create an app that guys like I am could use on daily basis to improve their climbing skills, yet track the progress. Like you do in Fitness app from Apple or NRC — app for runners by Nike. Sure, there’re a lot of other software that deserves to mention, but that two I’ve been using for years.

I started from prototyping and how the app would look like. I’d already decided that app would be written with the help of UIKit. At that moment I thought that SwiftUI is not enough for the project I’m about to start. For data base I decided to choose Realm and It was a really good choice as I figured out even more later.

First thing I began to make was design skeleton. As you can see on the photos bellow I decided to use pen and paper. Much appreciated tandem by myself, especially during my work. It’s so natural draw things. Sure, for more professional approach I should have used Figma or Sketch, but I dont care.

Since design and main features were done I moved to implementing. You’d might think that I began with a model or implementing a Tab Bar Controller, but no. The first thing I made was actually a timer. Since I’d never worked with Timer class before, I decided that I should realize what the actually to do with. Spoiler, it was not that hard. You just instantiate the Timer object and provide some info for it. Such as interval, starting point and where to begin/start/postpone. Here some of my working prototypes during my tests with Timer.

The next step was to add workouts to the application. The workout should be initialized right of the bat count down timer(this is one that prepare you to workout, like 3,2,1…). And after user finish the workout I had to add an observer to a collection view controller that receives changes and present them on a different tab in tab view controller. The result you can see down bellow.

Definitely I was not satisfied with design for overview view and workout view, so I started to draw a new version of design for the app. I wanted to make an entertaining interface which meanwhile wouldn’t be destructing. I experimented with different shapes for collection view cells, their content and how they are lay out.

The next versions of interface was nearly what I wanted, but not really enough. You can see how workouts section looks like. The section contains all workouts. Which is not correct because I shouldn’t be destructed as a user to observe ALL my activity, what I really would like to see is only a few last workouts and the button that could expand and show all my activity in the separate view. This adjustment was not saved on screenshots in my archive but in the release version this feature was implemented.

Later I finally stick with design for statistics section cells you can observe how they look like on the screenshot down bellow or on the app store, because it was not redesigned yet.

In addition during that period of development process I was thinking about how to present pre-workout view and I couldn’t imagine a better way but I just put a hand on a rock. The small button is on the image, which was I think a mistake and atm looks ugly, but back then I thought it was wise decision to do this.

Another problem with pre-workout view is the lack of info about workout, there too much empty space, it doesn’t mean that we need to fill this space with a bunch of text, but I should have add something entertaining to this view to make it more inspiring.

Next step is workout view, here was problems too, because of free space either. I din’t want to distract people who’re gonna use the app, yet I wanted to provide as much as possible of useful info for them. Like their splits, current time and buttons. Now I understand that the mistake was with colors, shouldn’t use cyan color for continuing button(the right one). Maybe it is not obvious at the first glance, but here’s an explanation to a symbol. As you can see on the left screen shot the person has his hands parallel to their body. It means that you are on the hang board atm. By tapping on the button rest mode is activated, person raises their hands which notify you that by tapping you’re going to be moved back to workout.

Before release I changed the size and color for the buttons on previous screenshots. So they have appropriate appearance.

Here the screenshots that was published for the first version of my app and as you can some issues I described above were fixed before release.

Thank you for your attention.