Category Archives: Helpful techy things

Hackference 2016, Part 2 – The Hackathon

<- Part 1: the conference
On Saturday, once everyone had got a good night’s ‘sleep’ (our hotel was just next to a loud club which only got quiet after 3am), we walked over to the Impact Hub.

Before I get started, I’m using the word ‘hack’ in the non-malicious form. Tabloids use the word ‘hacker’ to describe someone with malicious intent who steals data or takes down websites (for example, this article in the Mirror). We use it to describe someone who thinks the best way of learning is by doing. A hackathon is just a group of sleep-deprived developers playing with something new.

The event itself was free – paid for completely by the wonderful sponsors.

Before the hackathon started, not many people knew what they wanted to make (including me). Luckily the sponsors got a chance to inspire us with their products and announce their prizes. There was a variety of companies attending, each with some cracking prizes for the teams making best use of their services.

Continue reading

Advertisements

Hackference 2016, Episode IV: A New Hackference

Last weekend saw me heading to Birmingham to attend Hackference, a 3-day event for all sorts of programmers. There was a conference on Friday at the Electric Cinema, followed by a 24-hour hackathon at the weekend.

I’d never been to Hackference before, so I didn’t know what to expect. It’s a shame it’s probably going to be the last one though.

What follows is my account of the weekend, aided by plenty of tweets. The weekend was so jam-packed with stuff to blog about, so I’m going to split it up in two.

Part 1 – the conference

The Electric Cinema was a really cool venue. There were two screens, so two talks could happen at the same time. This was good because we could choose the talks that interested us most, but bad because most of the time I wanted to see both! Continue reading

Countdown API (because why not?)

I’ve updated my Countdown solver with a new word list that’s actually been designed for word games. The list is in the public domain and it claims to be compatible with the Scrabble rules, which I think are the same for Countdown. The problem is that it looks like it was last updated in 1993,  so if you want to play ‘selfie’ on my site, you’re out of luck.

Some point soon I want to add definitions to the words that get returned, because most of the time I see the results and have no idea what those words mean. In my research, I found a service called Mashape. The idea of this service is to enable discovery and monetisation of APIs. I found a word definition API that I want to use in the near future, but I got sidetracked by the thought of making an API that can solve Countdown puzzles.

So that evening I made my API. It didn’t take long to make because I’d already written a function that returned an array of the results – I just had to make it publicly visible. I also added more details to the results to aid filtering.

That’s over here if you want to make use of it.

Train Text-imonials

My train times site http://trntxt.uk is just over a year old. While I’ve picked up a handful of users, it’s fair to say that it’s not exactly gone mainstream. And that’s fine – it’s difficult to get people excited about a website that only has one function and doesn’t look visually appealing (by design).

I wanted to present trntxt at JSOxford‘s Show and Tell in May, but I knew that a black and white website wouldn’t make much of an impact. So I wanted to jazz up my talk with enthusiasm. Enthusiasm and memes.

Normally, the format of JSOxford’s Show and Tell session enables people to show off their personal projects by opening the live site in a new tab, without any slides, in about 2 minutes. And while this would have been OK, I really wanted to demonstrate the functionality on a smartphone, which is kind of difficult to do when there are about 50 people to present to.

Instead I used my slot to demonstrate trntxt in more of a ‘lightning talk’ fashion.

17 slides in 3 minutes.

trntxt presentation at jsoxford

Photo by Ryan Brooks

Continue reading

Imojify: my first JavaScript library

In which Dan finds a project other than Trntxt.uk to blog about, and says ’emoji’ 11 times.

TL;DR: I made Imojify, a library that converts emoji in :colon: notation into their graphical equivalents. It’s on GitHub, NPM and Bower.

On Monday morning I had an idea for a brilliant JavaScript library, but I couldn’t do anything with it because I had to go to work then I had a choir rehearsal. I got back from choir at 10pm with the idea still in my head along with some very catchy Christmas songs.

I had a working (but buggy) prototype by 1am.

The idea was a library that could convert colon notation emoji into their PNG image equivalent. For the uninitiated, colon notation is often used in chat services such as Gitter and Slack. It consists of a word or phrase wrapped inside a colon, such as :angry: or :stuck_out_tongue:. The big benefit of this sort of emoji is accessibility – if the picture isn’t rendered for whatever reason (e.g. for a blind person using a screen reader), it is still possible to understand what the author meant. Continue reading

Sleep easier after screen time with f.lux

F.lux is an application that adapts the colour profile of your computer to the rising and setting of the sun.

Your computer screens produce white light, the same colour (albeit different intensity) as the sun. This is fine during the day – the colours look natural, but as the sun sets, should we really still be looking at the sun? This is essentially what we’re doing when we use our laptops, phones and tablets at night.

There’s a lot of scientific evidence that shows the effect of blue light on the body’s production of melatonin (the hormone that helps you sleep). I’m not going to go into detail about this, just know that blue light is not good for you if you’re trying to sleep.

This is where f.lux comes in. As the sun sets, the application changes the colour of your screen to match the colour produced by light bulbs instead of the sun. When the sun rises, the colours go back to normal. On first use, this makes the screen look orange and weird, but it’s not long before you get used to it and wonder how you ever lived without it. Seriously. Once you’ve used it for a few days, try disabling it. You’ll feel your eyes strain to adjust to the new colour.

Without f.lux, You don’t tend to notice that the screen is a completely different colour to its surroundings until you see it in a photo.

flux.jpg

On the left is my laptop with f.lux disabled. The white of the screen is a completely different colour to the surroundings. Then with f.lux (right), the laptop’s colour is a more natural fit. It is more comfortable to look at for long periods.

Unfortunately f.lux is only supported on computers. On mobiles it’s a different story. The team at f.lux have made an app for iOS devices, but it only works on jailbroken ones. Apple don’t allow it on the app store because it requires access to settings which aren’t allowed to be accessed by apps. The thing is users can’t access these settings either. One of my friends has a jailbroken iPhone with f.lux installed and it looks beautiful at night. I want it, but I also don’t want to compromise the security and reliability of my iPhone.

I understand where Apple are coming from – I also don’t think f.lux should be in the app store – but instead it should be installed and enabled by default on all devices. It should be there as a setting right next to the brightness slider for everyone so that people who use their smartphones at night can get a better night’s sleep. The research supports it, f.lux users support it, it just makes sense. If a smartphone was released that natively automatically adapted its colour temperature as the sun set, I wouldn’t hesitate to buy it.

Related news:

http://www.bbc.co.uk/news/health-34744859

http://recode.net/2015/11/16/apple-tells-screen-dimming-software-f-lux-to-shut-down-its-ios-version/

Download f.lux here (Windows, Mac, Linux):

https://justgetflux.com

Update: Apple have added a F.lux-like feature ‘Nightshift’ in their most recent iOS9.3 update

Trntxt Autumn Update

I’ve made a couple of updates to trntxt since July.

One of the things I noticed during my user tests was that people typed ‘bristol’ when they wanted information about Bristol Temple Meads, Bristol’s main station. Unfortunately ‘bristol’ is a closer match to the smaller Bristol Parkway station because it comes above Temple Meads alphabetically. Before August, there wasn’t a way to get the user to correct their search, but trntxt now has search suggestions!

The feature was implemented while being moderately inebriated by a single bottle of Henry Weston’s at the Meanbee hack night in Bath.

Now if you go to http://trntxt.uk/bathspa/bristol it will ask you if you meant Bristol Temple Meads instead of Bristol Parkway.

Just don’t ask for ‘London’.

20151002_205404000_iOS

The other new thing is journey times. Trntxt now shows you how long each journey takes, so you can identify the faster trains more easily. The number is calculated with preference to the estimated timings, so if a train is delayed, the time will adjust accordingly.

20151002_210611000_iOS

Next logical step – sort by arrival time instead 😉

I’m also looking to make trntxt’s suggestions cleverer. I’ve started collecting data about the devices that use the site and the inputs people give. I’m hoping to expand that to also collect and store data from the National Rail Enquiries API. Don’t worry, the information collected is not personally identifiable (unless your user agent string is “HI MY NAME IS DAN”).

Hopefully, after some more practice with MongoDB I’ll be able to draw conclusions predicting the stations people mean based on their input. For example if someone types /bristol/london, they probably mean London Paddington, whereas /southampton/london should take the user to London Waterloo instead.

Trntxt bumper update

It’s been a while since I’ve posted an update on trntxt, and in that time lots of things have changed. Most of those things haven’t changed the site’s appearance at all, but I can assure you that I’ve been very busy with it over the past few weeks.

Service messages and bus times

Trntxt now shows you service messages from National Rail and timings for any rail replacement bus services. Days and days of work condensed into a single sentence…

nrcc

In order to make those changes simpler to implement, I had to make quite a few changes in the background. In doing so I learned more about the Jade templating engine and created a Mocha test framework with the help of Thom Wright at one of the Hack Nights run by CodeHub Bristol.

Little changes

Better station search

When typing a station name in the address bar, a more complex search takes place. Beforehand in order to match a station, the input had to match a portion of the station name exactly. Take for example, the station ‘Heathrow Airport Terminals 1, 2 and 3’. Originally, if you searched for ‘terminal1’, it wouldn’t produce a match. Trntxt removes all spaces and punctuation from the station name, but even then ‘terminal1’ doesn’t appear exactly in the station name – you’d need to have ‘terminals1’ which isn’t immediately obvious. Now it checks the station name to see if all the characters are there in the right order. You can type ‘lonwat’ for London Waterloo and it will return the match.

While writing the improvements to the search function, I made sure that the changes didn’t break anything else by running the tests. The test framework essentially contains a list of inputs along with their expected outputs. When I wanted to write a new feature or fix a bug, I’d put in some failing cases with the result it should return, then I carry on coding until the tests pass.

By running the tests automatically each time I save the code, I can be confident that the new code doesn’t negatively impact any of the past test cases because they are all checked every time.

tests

Appearance improvements

appearance

I decided that while still being minimal, I could improve the appearance of trntxt’s output. The 4 dashes I originally had to separate items have been replaced by a line; I’ve reduced the wordiness of each item description and the CSS fits inside a tweet (just because)!

#TweetYoCss

Preventing unnecessary app icon downloads

While investigating the network traffic to trntxt from different devices, I noticed that Android devices wanted to download the high resolution app icons for Apple devices, which is a bit of a waste when that icon is never shown. I now run a check to see what device is accessing the site, and only send links to appropriate icons for that device. It’s fairly unnecessary and especially not worth the effort to do it, but I did it anyway. Turns out it’s easy enough to modify the content of Jade documents based on various parameters, plus I was annoyed that all the icon tags almost doubled the size of the response (see below). I probably shaved nanoseconds off the page load time.

appicons

More to come

I’m not finished yet! There’s always something else I want to add to trntxt. Search suggestions coming soon!

suggestionMockup

Why trntxt beats your train times app

I’ve put a lot of work into making the trntxt experience as efficient as possible. Even though it was designed for old phones with a slow connection, it works well on modern smartphones, and in my opinion, beats any train times app out there. Of course I think it’s better (I did make it after all), but I’m going to try and explain why it’s better.

I once learned that when someone looks for information, it is best to have that information displayed after as few gestures as possible[citation needed]. My experiment compares the use of the National Rail Enquiries (NRE) app with trntxt, on both initial setup and subsequent use. I’m going to dig out my old iPod Touch for this because my phone doesn’t do screenshots and nobody else has Windows Phone 7. At the start of the experiment, we are going to assume that you know the name of the app but it isn’t installed, and you know the URL of trntxt but have never visited it before.

Continue reading

Let’s talk about mobile data

In this post I’m going to talk about what I’ve done (and what I’ve not done) with trntxt in order to get the fastest page load times possible. I’ve split this up into two sections. The first part might be interesting to most of you, whereas the second part goes into technical detail that will look like complete gobbledygook if you haven’t programmed using Node before.

You have been warned.

Continue reading