Vincent Ritter

Projects

Follow along as I build out product ideas with regular updates on progress, screenshots, thoughts on a particular way of doing things and so much more. This is at the heart of what I do and I love it.

Currently active projects:

These are my active development projects at this time. You can click/tap through any of them for more info and see specific posts for the project.

Gluon for Micro.blog

An app for both iOS and Android, built on React Native, for Micro.blog.

Status for updown.io

A simple app to display monitored sites from updown.io, with current status and other stats.

Launched projects:

These projects have been launched and are live 🚀

Simple Schedule

A new and simple way to manage bookings, appointments and gatherings on the web

Recent posts from active projects:

Last night I tidied up a few things on Gluon. Simpler screens and logic, moved search to “Discover More” as an experiment, ultimately getting rid of clutter on the tab bar. Also managed to reduce the app size by 100KB. And added push! Coming soon 😊

Just pushed out build 8 (2019.1) for Gluon. This fixes an outstanding, and longterm, issue with swiping back out from a conversation or somewhere where feed items are showing.

Thank you to Matthew for bearing with me on this one! It still requires some tweaking but I hope this is an improvement already.

Spent the day working on registering for push notifications for Status. Includes a small Rails based API. It’ll activate by talking to the API and on success, and checks, will return a nice UUID, which in turn also registers a webhook with updown.

Status for updown.io - Initial check details header styling, read only api keys and re-auth screens

Made some more progress with Status. Although it doesn’t seem much “customer facing”, I’ve done a lot behind the scenes especially handling logging in again if, for some reason, your API key becomes invalid.

Also started to implement the “read-only” check. If you’re using updown.io you’ll know there are two keys you can use. With that in mind, I also had to add a re-auth screen.

Before I worked on that, though, I started work on the initial header of the actual “check” details screen. So far I’m pretty happy with the results. Here’s a few early screenshots.

Quick summary in the header of your uptime. If you have an alias set, it’ll show that together with the URL underneath. You can tap on that and it will take you to the URL in question.

This one shows an error right at the top of the page, with the corresponding error message.

Of course you can pull to refresh to update the necessary check. If it comes back to life, it’ll go nice and green again (except perhaps the uptime - which depends on the percentage).

If you have a bad SSL, it’ll show that too. I still need to populate the whole screen with data… so more details will be shown soon.

Before I go, here is a screenshot of the re-auth modal that pops up if your API key becomes invalid for some reason:

I’m using the same screen, without the big error, for re-authenticating with another key - for example if you logged in with a read-only key.

The settings screen also reflects what kind of API key you have… and will also tell you if it’s invalid.

Tapping on that will bring up the re-auth screen.

Overall happy with the achievement today.

I’ve been tapping back and forth to try and figure out how to design the “check” screen… notepad is ready, with a blank canvas. Need to find inspiration. At least I got a nice status on the top right already, looks nice!

Status, an app for updown.io - progress

I spend a few days last week, and the weekend, to start my little project up again for an app that you can use with updown.io. If you haven’t heard of it, it’s a website monitoring tool which is, hands down, one of the best tools out there. It’s simple, doesn’t cost you an arm and a leg and gives you enough customisation to really monitor your websites and services with ease.

The project stalled because I just had too much client work, and when you freelance you just have to do those things! However, I’m slowly going back to my zen place of a good mix of client projects and free time just for my own stuff. Nope, this is not my “secret project”.

Saying all that I set up a completely vanilla project last Wednesday. Blank slate, start again, throw away the old. I pretty much used most things I learned from Gluon and took the best bits (the foundation) and got cracking.

The updown.io API is really great and simple, with enough good data. So it was super easy to just get started. For login purpose you’ll have to use the API key that you can find in your account. There is both a full access key and a read-only key.

Whilst Status can work with read-only keys, it will be much better with full-access. Status will lock certain sections of the app depending on which key you use.

It was actually quite fun to code so far, here is the login screen:

It’s got my standard login form that I used on Gluon. However, I actually re-wrote it all. Just kept the styles.

It’ll show you some useful messages when typing in a read-only key, or if your key is wrong. On “Login” the app will make a call to the updown API and try and fetch the checks you have on your account. If there are any problems, it will let you know straight away.

The login flow is pretty fast and your checks will be waiting for you.

Yesterday I spent some time to style the cells, they’re very much updown inspired. It’s a great interface!

It’s quite basic with the right information in front of you. I may add the option to allow you to view the graphs also, although I’ll certainly implement that on the details screen. Note that I’m hiding a few names in the screenshots.

Of note, you can see there are 4 websites that are down/throwing an error. That’s a dedicated section just for those. Your normal Checks screen will also show you any down sites:

You can see a good mix here of errors, disabled and normal sites, including errors that are relevant.

If your site is served via HTTPS, the scheme will be correctly colour coded to tell you if the SSL cert is valid or not. Again, if you’re used to updown, that works in a similar way.

The “Down” screen looks like this when there are errors:

Easy enough and quick to reach. Once you’re all up and running again the header will be green and a small message is shown to say it’s all up and running.

The app also works on Android, here is screenshot of the “Check” screen:

I'm pretty happy with the results so far and it certainly has been fun doing something a bit different. Change of scenery is nice.

I’ll be spending the rest of the week on the details view and perhaps allow you to add/edit checks also (as a stretch goal).

There is also a small API to write for it to allow push notifications for any errors. Updown provide webhooks and Adrien, the creator, kindly added an endpoint to allow you to add web hooks via the API. Nice!

Anyway, so far I’m pretty happy with the result and can’t wait to work on it a bit more this week.

I’ve been doing some back and forth with Gluon lately. Haven’t felt much motivated to work on it as I’m thinking that I could dramatically reduce the visual clutter.

Also tried to work on an action bar… but it doesn’t really fit with my vision. I’ve got a few ideas I want to try… I think it’s for the better.

Will it ever be released? Some day… yes!

Close