
As you might already know, I love coding and designing.
I couldn't help myself but use the powerful SwiftUI framework and build an iOS game with playful animations.

# Learning Resources

I started looking into SwiftUI the day it was released. I started with Apple's own tutorials.

A couple of days later, I discovered [Hacking with Swift](https://www.hackingwithswift.com) on Twitter.
There, I learned a lot about SwiftUI and its API, but couldn't find as much as I wanted about animations and transitions.
Meanwhile you can find a complete list called [SwiftUI By Example](https://www.hackingwithswift.com/quick-start/swiftui).

To dive deeper into animations and transitions, I went back to my trusted design tutorial source [Design+Code](https://designcode.io/).

# Design

I stared designing in Sketch to get a feeling of how the game would be. After some iterations, I had something I could start coding in Xcode.

<img src="/contents/project/rapilo/sketch-screens.png?v1" class="block my-8 shadow-xl min-h-48 mx-auto rounded-lg" />

## Colors

Besides the gray colors, I used the default iOS colors `Color.pink`, `Color.orange`, `Color.green` and `Color.blue`.

## Icons

I used the new iOS icons font introduced with iOS 13 called _SF Symbols_.
The leaderboard is the only icon I designed myself, which is exported as _PDF_ to be used as a vector.

# Developement

After exporting the one icon and the gray colors to the `Assets.xcassets`, I was ready to start coding in Xcode.

I strongly believe that if a UI feels wrong, it's not going to be used. That's why I started with the UI and animations first.
It took me some time until I had something I felt was the right amount of animations and types of transitions.

<img src="/contents/project/rapilo/playing.gif?v1" class="block my-8 shadow-xl w-64 min-h-48 mx-auto rounded-lg" />

After the UI and animations, I added the state management using the _Combine_ framework.
Adding the leaderboard by using Game Center, was the last bit i did before I started beta testing.

# Beta Tester

If you want to be a beta tester, just sign up [right here](https://testflight.apple.com/join/WwxTW39J).
Don't forget to give me your feedback. It helps me to improve the game so you can have even more fun.


An iOS game build with SwiftUI using custom animations and transitions.

Rapilo


<small>Co-Written by [Susana Garcia](https://susana.dev)</small>

We built [500error.co](https://www.500error.co) because we had to solve one of our problems. The idea was first pitched on [Pitchcard.io](https://www.pitchcard.io) and got a lot of traction. So we decided to built it, and we did it in less than two weeks.

# How It Started

We ([Susana Garcia](https://susana.dev) and I) like to build things. We don’t like to talk about how cool it would be to do this and that — we just do it. The outcome is that we have a lot of projects simultaneously.

As we all know, servers can crash and “oooh boy they do”. And you know what, they crash at the worst time. They crash while your release and you lose important leads. Or they crash while you sleep and we really like to sleep 💤. We decided to fix this problem.

# Developing in Bratislava

We’re digital nomads and we moved to a new city every other month, but that’s another story. For this month, we’re in Bratislava.

We used our very first day in Bratislava to collect all feedback from Pitchcard.io, friends and other developers. We picked the most important features for a MVP.

We used the second day to choose the right tools to built this, and ended up using NodeJS with Express for the backend and React for the front end, as we had already positive experiences with these tools building [Pitchcard.io](https://www.pitchcard.io).

From day three up to day seven, we built the MVP and send some invite emails to the investors of [Pitchcard.io](https://www.pitchcard.io). They liked the simplicity and gave us really good feedback, what we could improve and what they were missing.

We used the second week to improve the UI for mobile, tablet and desktop. We also added a simple subscription with [Stripe](https://medium.com/u/3ecae35d6d66) (we really like Stripe). And we added better documentation of how to integrate it into Heroku, GitHub Pages and more.

# Customize Your Page

Our beta users like the way they could customize their error pages. They like it because it’s simple and funny. Here is what some things you can customize:

- Add your own brand color
- Choose one of the funny GIFs or just add your own Logo
- Define your title and description so it sounds like you

# The Result

We’re happy that our beta users liked the first version and we’re proud of what we could built in less than two weeks.

Now we can sleep at night without worrying about a crash on all these projects. If a server crash happens, we can fix it the day after and notify the new subscribed users. It’s simple as that.

Do you want to be able to sleep at night without worrying about your server? [Visit **500error.co**](https://www.500error.co), create your own error page, integrate it into your existing projects and have one less thing to worry about.


We built 500error.co because we had to solve one of our own problems.

500 Error


<small>Co-Written by [Susana Garcia](https://susana.dev)</small>

Since the iPhone released and the following AppStore boom, a lot of people around us began to have amazing ideas: “Hey, I have a really cool idea for a new app!”. Every single one of them thought, they had the next billion dollar idea.

# Get to the Point

They usually tried to explain it in a very complex way or sent us very long emails. As we both don’t like emails, long emails even less, we told most people to get to the point.

We believe that every good idea needs to be pitched in _2–3 sentences._ And this is only possible if you exactly know what the goal of your idea is.

# Share Your Idea

There are another few things that some people don’t know about good ideas.

Some people don’t talk much about their idea to protect it. They are afraid of someone stealing it. Fact is, **the more you share your idea, the better it gets.** Each time you explain your idea to people, they’ll ask you questions. First you won’t have an answer but it will force you to rethink your idea.

Another important thing is, what for you might be a pretty good idea, others wouldn’t even use it. And _what’s the point of creating something no one will ever use?_ Evaluate your idea first, then decide to build it or to move on.

# Quick Feedback

That’s why we’ve built [Pitchcard.io](https://www.pitchcard.io/) to get quick feedback. We’ve picked this name because of the elevator pitch.

> “\[..\] the idea that it should be possible to deliver the summary in the time span of an elevator ride, or approximately thirty seconds \[..\]”

## How it works

1.  Visit [www.pitchcard.io](https://www.pitchcard.io/)
2.  Create your _Pitchcard_
3.  Share it

We know that ideas can pop up anytime and anywhere (having lunch, doing sport or meeting up with friends). That’s why we made it very easy to create a _Pitchcard._

You can share your _Pitchcard_ with close friends via WhatsApp and email, or with everyone via Facebook, Twitter or others.

Another important point of _Pitchcard_ is, that we consequently set a **200 chars limit on the description** of the idea**.** As we already mentioned before, we want that people get to the point.

We hope you like our product and wish you good luck with your next billion dollar idea. 😜


Since the iPhone released and the following AppStore boom, a lot of people began to tell us: "Hey, I have an app idea...".

Projects

Don't miss out.