This week we released updates to HabitCat, our simple mobile app to develop and track new routines and habits.

  1. We created an improved welcome screen that displays our cute cat logo and looks a bit more welcoming.

  1. Habits can now be deleted and reorganize from the home screen! Just click on the "Edit" button on the top right corner.

  1. Someone reached out to us on Twitter to suggest a randomized default color for habits. That's a simple, neat little detail, so we did it.
  2. We were (and still are) looking for ways to improve our form to create new habits. We are trying a new way to present the colors as a wheel instead of a grid. We should maybe think about making it more interactive (would it be cool to be able to spin it?) in the future.
  3. Improved localization for our three supported languages: French, German, and English. The back button and date content (months, days, etc) are now localized correctly everywhere.
  4. Some touch are...
Read full post

I'm currently learning to use the game engine and editor Godot, and I just realized today that you can see and inspect the complete scene tree of a running Godot project.

It's easy to do, but somehow I didn't know about it, the button to click has an unexpected name ("Remote") that doesn't really communicate what it does!

  1. Start your scene (with F5 or by clicking on the Play button on the top right corner)
Use F5 or Play button to play your main scene
  1. Now that the scene is running, notice that at the top of the "Scene" section you now have two labels, Local and Remote
When running, you can now see the 'local' or 'remote' scene
  1. Local shows you the tree as it is in your scene file, while Remote shows you the tree as it is on a "remote running process"! Click on it and you can now inspect any node as they are in your game. As an example, in the following screenshot Tile is a node added dynamically from a script.
Select 'remote' to see the current state of your r...
Read full post

Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Check out the rest if you haven't yet 😉.

In the previous article we implemented an interactive search. The next natural step is to display the search results!

As a reminder, in part 2 I made a mockup of the application that we are building. That's how the list of result was represented:

The list of articles in our mockup, highlighted

What can we get from this?

  • Our application has a top menu (that we already created) and a content section
  • The content section is divided in two panels, the list of articles is on the left side, and article detail on the right side
  • The list is displayed vertically, and is likely to be scrollable
  • Every r...
Read full post

Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Check out the rest if you haven't yet 😉.

Before starting to work on our project, let's define a plan and a set of goals.

We know that we want to interact with Wikipedia's API, so what do we need for this? A first version would be like this. I will keep our goals simple for now, we can always add more things later.

hand drawn mock-up
A hand-drawn mock-up of our initial goal (click on the picture to see it full screen)

Abstractly we have 3 components:

  • a simple search for in a menu bar available at the top of the application. The first version will only have an input text and a button to call the API.
  • a listing of search results in a left pan
  • a right pan to vi...
Read full post

Note This article is a part of a series of tutorials "Creating an Electron application with Svelte 3 and TypeScript".

Earlier this month the team behind the web UI framework Svelte announced they are now officially supporting TypeScript. I didn't follow the project before this announcement, but I see it as a good motivation to try it out. For this reason I decided I would create a simple Electron application interfacing with Wikipedia's public API, and will document the process through a serie of tutorials.

I read Svelte's documentation yesterday for the first time, so I'm really new to the framework, though from what I've seen so far it should be quite fast to pick up. As mentioned in the title, I'm going to use Svelte 3 and TypeScript. Let's start with the initi...

Read full post