Back story: my period of walkabout, in which I went to see the rest of the computing world beyond Apple land, started in November 2014. This was shortly after Swift’s introduction at WWDC 2014. It ended in October 2018, by which time the language had evolved considerably, its position in the community had advanced greatly, and SourceKitService had stopped crashing.

I have previously written on the learning phases I encountered on exposure to Haskell, now what about Swift? I have the opportunity to reflect on how I react as a beginner, and share that so that we all learn how we (well, I) learn, and maybe discover how we can teach.

About the project

I’m writing a tool that I want, which takes files in one format (RSS) and writes them out in another format (Maildir). You can follow along. The reason for mentioning this here are twofold:

• I do not know what I’m doing, but I’m willing to share that.
• To let you understand the (limited, I think) complexity of the thing I’m trying to build.

Thinks: This should not be that hard

I often feel like Swift is making me feel like an idiot. This is because my expectation is too high: I know the platform fairly well. I know the Foundation framework pretty well. I know Xcode pretty well. I understand my problem to some extent. It should just be the programming language that’s different.

And I do different programming languages all the time. What’s another one going to do?

But of course it’s not just the programming language that changed. It changed the conventions for things like naming methods or raising errors, and that means that the framework methods have changed, which means that things I used to know have changed, which means that I do not know as much as I assume. It introduced a new library, which I also don’t know.

Thinks: That unimportant thing was really frustrating

Two such convention changes are correlated: classes that used to be Foundation and are now standard library (or maybe are Foundation still but have been renamed on being bridged, I’m not sure) are renamed from NSThing to Thing. That means that the name of NSURL is now URL.

That means that if you have a variable that represents a URL, you can’t follow the Cocoa convention of leaving the abbreviation uppercased and calling it URL, because now it’s got the same name as the type URL. So the new convention is to call it url.

Objectively, that’s not a big deal. Subjectively, this stuff is baked in pretty deep, and changing it is hard.

Thinks: Even learning something is frustrating

The last event to make me get up and walk around a field was actually discovering something new about Swift, which should be the point, but nonetheless made me feel bad.

I have discovered that when it comes to working with optionals, the language syntax means that There Is More Than One Way To Do It. When I learned about if let and guard let, I was confused by the fact that the thing on the right needed to be an optional, not unwrap one: surely if my rvalue is an optional, then my lvalue should be, too?

Then, when I learned about the .? and subsequently ?? operators, I thought “there’s no way I would ever have thought to type that, or known how to search for those things”. And even though they only make things shorter, not different, I still felt frustration at the fact that I’d gone through typing things out the long way.

Thinks: There’s More Than One Way Not To Do It

One of the Broken Expectations is that I know how to use Strings. Way back when, NeXT apps used char * as their string type. Then Enterprise Objects Framework came along with its Foundation library of data types, including a new-fangled Unicode string class, NSString. Then, well, that was it for absolute ages.

So, when I had a String and I wanted to take the substring to an index, I was familiar with -substringToIndex: and tried to apply that. That method is deprecated, so I didn’t want to use it. OK, well I can string[0..<N]. Apparently not, integer subscripting is not allowed, and the error message tells me to read a code comment to understand why. I wish it told me where that code comment was, or just showed it to me, instead!

Eventually I found that there’s a .prefix(N) method, again this is the sort of thing that makes me think: what’s wrong with me? I’ve been programming for years, I’ve been programming on this platform for years, I should be able to get this.

Conclusion: Read a Book

I had expected that my knowledge of the Mac, Xcode, and Cocoa would be sufficient to carry me through a four-year gap on picking up a language, particularly with the occasional observation of a conference talk about the Swift language (I’ve even given one!). I had expected that picking up a project to build a thing would give me a chance to get acquainted.

I was reflecting on my early experiences with writing NeXT and Mac applications in Objective-C. I had my copy of the NeXT Developer Documentation, or Cocoa in a Nutshell, open on the desk, looking at the methods available and thinking “I have this, I want that, can I find one of these that gets me there?” I had expected that auto-complete in Xcode would be my modern equivalent of working that way.

Evidently not. Picking up the new standard library things, and the new operators, will require deliberate learning. I’ve got some videos lined up, but I think my next action is to find a good book to read.

A (usually) weekly round-up of interesting links I’ve tweeted. Sponsored by Smashing Magazine who slip banknotes into my underwear so I can spend time reading stuff.

• The ROI of UX – “showing custom error messages increased conversions by 0.5% which equated to more than £250,000 in yearly revenue” (quotation from “Form Design Patterns” by Adam Silver).
• Free live transcripts – website listens to you and transcribes in real time. Uses Chrome-only experimental Web Speech Recognition API. Did pretty well on my Brit accent.
• A Very Informal Look at Gutenberg Accessibility – “my clients…asked to switch…Drupal …to WordPress because of WP’s UI advantages. …updates to the upcoming WP 5.0 release, specifically the new Gutenberg editor, appears to be undoing these advantages.”
• … and Some Gutenberg Accessibility Clarifications by Joe Dolson, a member of the team.
• CSS Grid Posters – “An exploration into the world of possibilities with CSS grid.
• modalzmodalzmodalz – “We use too many damn modals”, with lots of suggestions for better UX patterns
• Building a video editor on the web. Part 0. – “I am going to start the long process of working out what is and isn’t available on the platform and seeing how far we can get today” by Paul Kinlan
• MeasureOSS – a “contributor relationship management system”, to help you see how engaged contributors are in your public project on GitHub, by @sil et al
• Designing for Cognitive Differences
• The state of fieldset interoperability – The state of fieldset interoperability
• How important are mobile broadband networks for global economic development? – “on average, a 10% increase in the mobile broadband adoption ratio causes a 0.6–2.8% increase in economic growth”
• WebKit Feature Focus for 2018-2019 – “200 features planned”
• Google unshackles Android-device firms – Manufacturers are not required to ship Chrome and Search if they pre-install YouTube, Maps etc. Good for ecosystem. Thanks, EU! I really hope Mozilla can do some OEM deal to get Firefox pre-installed on some Android devices rather than Chrome. We really need more browser diversity.

Jeremy Bicha wrote up an unknown Ubuntu feature: “printing” direct to a Google Drive PDF. I rather wanted this, but I don’t run the Gnome desktop, so I thought I might be out of luck. But no! It works fine on my Ubuntu MATE desktop too. A couple of extra tweaks are required, though. This is unfortunately a bit technical, but it should only need setting up once.

You need the Gnome Control Centre and Gnome Online Accounts installed, if you don’t have them already, as well as the Google Cloud Print extension that Jeremy mentions. From a terminal, run sudo apt install gnome-control-center gnome-online-accounts cpdb-backend-gcp.

Next, you need to launch the Control Centre, but it doesn’t like you if you’re not running the Gnome desktop. So, we lie to it. In that terminal, run XDG_CURRENT_DESKTOP=GNOME gnome-control-center online-accounts. This should correctly start the Control Centre, showing the online accounts. Sign in to your Google account using that window. (I only have Files and Printers selected; you don’t need Mail and Calendars and so on to get this printing working.)

Then… it all works. From now on, when you go to print something, the print dialogue will, after a couple of seconds, show a new entry: “Save to Google Drive”. Choose that, and your document will “print” to a PDF stored in Google Drive. Easy peasy. Nice one Jeremy for the write-up. It’d be neat if Ubuntu MATE could integrate this a little more tightly.

5 places to find remote jobs online

It’s only natural to keep an eye on the job market, even if you’re a seasoned (old) freelancer like me. It’s healthy to know what opportunities are out there and the skills required to fill those roles.

Over the years I’ve discovered several remote job sites that specialise in roles for the technology industry. Here’s some sites for you to find that perfect remote role.

Dribbble

Dribbble Jobs is an excellent resource for job hunters. It’s not dedicated to remote working but they do have a filter that refines the roles to satisfy that requirement. You’ll find it on the right hand side. Great for designers (duh)

http://dribbble.com/jobs

—

Remotive

Remotive is a really nice site aimed at hoping job seekers find remote jobs, they claim to be helping 25,000 people finding their dream job. Great for developers and engineers.

https://remotive.io

—

Honest.work

Honest.work is a great resource for those who like to work from home. They make sure that salaries and rates are clear and introduce you directly to companies looking to hire. Great for developers, designers and Marketing professionals.

https://honest.work

—

RemoteOK

RemoteOK has some really amazing roles, you’ll more likely to find some big brands hiring on this site. Similar to honest.work and Remotive, this site is ideal for creatives and engineers.

https://remoteok.io

—

Angel.co

Angel is the place to be if you’re hunting for the hottest new startup roles. Like Dribbble Angel.co isn’t solely for remote workers but does have a filter. This site is ideal for creatives and engineers.

https://angel.co/jobs

—

BONUS

Product Hunt

ProductHunt is the darling of the startup world, they list awesome products, startups and companies. They also list some great remote jobs. You’ll find some great startups here, ideal for developers.

https://www.producthunt.com/jobs

—

Any other places?

Drop me a message on Twitter (@zer0mike) about any sites I’ve missed and I’ll add them to this list.

—

Please checkout my work – I’m proud of it all and would love you to view it.

While I have you, read about how I’ve been freelancing for 10 years.

The post 5 places to find remote jobs online appeared first on .

Update

The information below is mostly redundant. After filing a bug report with Apple, their engineers determined that the Xcode-detected set of macro actions (find a text field, double click, enter text) weren’t working because the double click action wasn’t editing the text field. It is possible to use UIAutomation Tests, you just have to carefully review the UI actions and determine that they have the effect expected, particularly after letting Xcode record UI macros.

Original Post

Unfortunately my work to organise UIAutomation tests has hit the stumbling block that the UI Automation runner doesn’t use the main thread for main-thread-only APIs.

In Xcode 9 and High Sierra, the authors of that post I just linked found that it was possible to turn off the main thread checker in the Test configuration of the build scheme and get working tests anyway. Unfortunately that doesn’t work for me in Xcode 10 and Mojave: the main thread checker isn’t killing the app: the TSM subsystem is just refusing to do its thing. So my tests can’t do straightforward things like write text into a text field. Unfortunately this is a “it’s not me, it’s you” moment, and I don’t think I can carry on using Xcode’s UI tests for my goals.

However, I still want to be able to write “end-to-end” level tests to drive my development. I have (at least) three ways to proceed:

• I could find a third party library and discover whether it has the main thread problem. Calabash doesn’t support Mac apps, and the other examples I can find (Cucumberish and TABTestKit) both rely on UI Automation so presumably don’t address the main thread problem.
• I could write the tests in AppleScript. That would be a good way to build up the AppleScript UI for the app, but it doesn’t represent an end-to-end test of the GUI.
• I could write the tests using NSApplication.sendEvent(_ event:) to simulate clicks, scrolls and text entry, and use the unit test runner to host them. That could work, but I have my doubts (I would guess that the runner is synchronous and stalls the main thread).

I discovered that it is possible to write the test “at the UI level” but in the unit runner, using a combination of key events and AppKit API like sendAction( to:). The trade-offs of this approach:

• it takes longer, as the abstractions needed to easily find and use AppKit controls don’t (currently) exist
• it doesn’t use the Accessibility interface so isn’t an accessibility audit at the same time as a correctness test
• you don’t hit the same problems as with the UI Automation runner
• it’s much faster

This may be the best approach for now, though I’d welcome other views.

A (usually) weekly round-up of interesting links I’ve tweeted. Sponsored by Smashing Magazine who slip banknotes into my underwear so I can spend time reading stuff.

• Link o’ the Week: Inclusive Design 24 – YouTube videos of free 24-hour online event about inclusive design for the global community. Thank you to all organisers, hosts and sponsors for this fabulous service.
• One Invalid Pseudo Selector Equals an Entire Ignored Selector .. but not any more for -webkit- pseudo-elements in Firefox. Die, vendor prefixes, DIE!
• Using the Web Audio API – loadsa tutorials from beginner to advanced by Your Friend, Ruth John.
• I have resigned as the WordPress accessibility team lead. Here is why. – it’s why I turned off the Gutenberg editor on my blog.
• Accessibility is Not What You Think – “Accessibility is not about designing for the few. It is designing for us all” says Uncle Paul Boag.
• An nth-letter selector in CSS – Jezza makes a compelling case for adding this to the canon
• Context, Culture And Service Design – Marc Fonteijn interviews Diego Mazo about the need for deeply understanding local culture in service design. (30 min YouTube video).
• Project Strobe: Protecting your data, improving our third-party APIs, and sunsetting consumer Google+ – “”We are shutting down Google+ for consumers”
• ​Microsoft open-sources its patent portfolio – That’s 60,000 patents. Bravo.
• Pornography, Rape, and the Internet (PDF) – “the arrival of the internet was associated with a reduction in rape”, especially in men aged 15-19. So why is the UK government censoring porn, when evidence suggests that will lead to more sexual assaults?
• What’s in a number: how love for expensive cars and number plates revealed the second Skripal suspect’s indentity – it’s amazing what you can find on the web these days. “Ah, Mr Bond – we’ve been expecting you, because we tracked your Bentley through webcams with unchangeable default admin passwords.”

Q Content UI & UX Design

Q Content are a UK based technology business in the creative content industry.

The Q platform had already been live for a number of years but was showing it’s age. I was approached to help Q add some skilled design to their platform and I was excited to get involved.

Q knew their platform inside out. They knew what worked and what needed some UX TLC, they had done extensive research with their regular users and had a list of challenges for me.

I love a challenge. I’m really happy with the results.

—

Did you read 5 Reasons why startups make great clients?

—

Kobu Agency

The post Q Content – UI & UX Design appeared first on .

Citystasher UI & UX Design

A while ago I was asked to work on a new project for the team over at Citystasher (Now Stasher), a London based startup aiming to disrupt the travel / baggage market. This sounded like a solution to a problem I’ve struggled with before. Where do you keep your large bags when in a huge city? They have a simple solution, in many places very near to you. Hotels, Stores and other trusted places.

CityStasher is a convenient, safe and affordable way of storing your bags across the UK, without having to pay the expensive Airport fees.

While their business has gone through many changes in the year or so since I worked on the project and their site doesn’t reflect fully what I worked on I still thought I’d created some nice work and wanted to share.

—

While I have you. Give in to time off!

—

Thomas Quaritsch

The post Citystasher UI & UX Design appeared first on .

It’s OK Not to Chase Constant Growth With Your Freelance Business

All too often within business, we chase the idea of more – more work, more responsibility, more money. While an ambitious growth mindset can be great for a business with the resources to back it up, it can be exhausting for an independent freelancer.

Photo by Markus Spiske on Unsplash

Sometimes, when running a freelance business, it’s more realistic and less stressful to be content with what you have. Freelancing is notorious for the feast and famine cycle that generates unstable income, so simply generating a constant, predictable amount month-to-month, year-to-year, is actually a big achievement.

This post came about after speaking to fellow freelancer Zack Neary-Hayes and realising that we had a lot in common, mainly due to how we view our businesses and our ambitions for them.

The rest of this post has been written by Zack and is an overview of a conversation we had back in August 2018.

How much is freedom to work your way worth?

When Mike and I were talking, we realised that even though the services we offered to our clients were different, there were quite a few similarities between our businesses:

1. We both run service driven businesses direct to clients, and there was a lot of overlap between the things we liked and disliked about this.
2. The freelance and remote working lifestyles are extremely important to both of us. Neither of us felt particularly driven to try and target significant growth within our businesses. We’re both content with how things are going.
3. We both agreed that we prioritised having the freedom to live a lifestyle that we choose, to work on projects we find interesting, and ultimately, to earn a living on our own terms.
4. We’ve both recognised that we have skills that businesses need, so we sell those skills directly into businesses, which grants us a level of freedom we generally wouldn’t have through normal employment.

Do you want a growth or lifestyle business?

Photo by Alvin Balemesa on Unsplash

For me and Mike, the idea of having a lifestyle business is much more important than chasing growth. It’s important for us to produce great work, have good relationships with clients, but also to enjoy as much time outside of our freelance work as possible.

And with this mindset, it becomes much easier to be OK with not being obsessed about aggressively growing your business. Work can become a healthy process that enables us to dive in and enjoy hobbies, interests, and passions outside of work.

I find it relatively easy to build a ‘church and state’ like separation between work and my personal life. I know the reasons why I work – why I freelance – and I keep this motivation front and centre of everything I do.

I think this key: you don’t need to feel like you need to chase growth to be a successful freelancer. Maybe this is why both Mike and I feel content with our businesses the way they are; we’re not driven by growth targets and financial forecasts, so we don’t feel the need to dig in and grind with work unnecessarily.

Work should be a good fit for your lifestyle

Photo by Nicole Honeywill on Unsplash

If you can look at your work and feel truly content with how it’s going, then that’s great. You’re doing something you enjoy and making money in the process, a win-win situation.

If you’re in this situation and you’re earning enough to comfortably cover all of your living, business, and lifestyle costs, then do you really need to aim for more next year? Sure, you may put up your prices as you gain another year of experience and have reduced capacity, but do you actively need to set your ambitions on growing more? And would it be deemed a failure if you missed those targets?

Freelancing is a two-way street. It needs to work for your clients – you need to be able to confidently deliver your service – but more importantly, work needs to be a good fit for you.

As long as you can draw some sense of fulfilment from your work, and have plenty of things you enjoy outside of work, then you’re on the right path for a balanced lifestyle. Money may motivate you. Working reduced hours may motivate you. Having as little stress at work as possible may be your prime goal. The trick is to hit whatever goals you need to to make you feel comfortable and content. These goals may not always be financial.

And what works for others in this situation may not be the right fit for you. If the grinding, hustling, getting up at 4.30am lifestyle isn’t for you, no problem, forge your own path and work on your own terms. Don’t feel pressured by how other people present their work and freelance businesses.

Remember: you’re in control of your own business, and the most important thing is that the business works for you.

Photo by Devin Edwards on Unsplash

Thanks to Zack for the post. I’ve also written lots about Freelancing over the years, you may also enjoy reading ‘Be a better freelance designer‘, ‘Reflecting on 10 years as a Freelancer‘ and ‘Better ways to manage your design leads‘

The post The Freelance Business Dilemma: Do You Really Need to Chase Growth appeared first on .

(Russian translation: Почему мы не добавим в HTML элемент <чудесный>?)

Yesterday, there was an interesting conversation, started by Sara Soueidan:

Something I’d like to see in HTML:

<color value=“” />

Simple. Extremely useful, esp for design systems today.

— Sara Soueidan (@SaraSoueidan) October 8, 2018

Now, before people start to think “but colour isn’t content, it’s presentation!”, Sara was talking of pages showing colour swatches. In this case, the colours are the content. It seems like a good candidate for a semantic element, because it has meaning.

In my capacity as Ancient Old Fogey Of The Web, I sat and thought about this.

HTML: The mis-spent youth

The first iteration of HTML was a small set of tags noted down by in an email from Sir Uncle Timbo in October 1991, and added to in November 1992. By the time HTML2 came around, some tags had changed names, and a few tags added that showed HTML’s primary use as a language for mathematics and computer geeks: <var>, <samp>, <code>, <pre>, <kbd> as well as the now-defunct <xmp>, <dir> and <listing>.

At this point, we only had three presentational elements: <tt>, <b> and <i> (and arguably, <i> isn’t presentational—the spec says “If a specific rendering is necessary — for example, when referring to a specific text attribute as in “The italic parts are mandatory” — a typographic element can be used to ensure that the intended typography is used where possible.”)

Further generations of HTML reflected the changing uses of the Web; it was no longer the read/write medium that Sir Uncle Timbo had envisaged, so we needed a way of sending information back to sites – thus, a whole form-related markup evolved, which subsequently has served eCommerce brilliantly. Tables were added to show data, extending the web’s original use-case of showing and sharing mathematical papers. This had the side-effect of allowing creative people to (mis)-use tables to make great-looking sites, which meant ever more consumer-friendly sites (and a menagerie of presentational markup which is deprecated now we have CSS).

By the time HTML5 came around, we added a whole slew of elements to demarcate landmarks in common web page designs – <nav>, <header>, <article>, <main> and the like, which has improved the experience for assistive technology users.

By my count, we now have 124 HTML elements, many of which are unknown to many web authors, or regularly confused with each other—for example, the difference between <article> and <section>. This suggests to me that the cognitive load of learning all these different elements is getting too much.

HTML: comfortable middle-age

There’s loads of stuff we don’t have elements for in HTML. For ages I wanted a <location> element for geo information and a <person> element (<person givenname="Bruce" familyname="Lawson" nickname="Awesome" honorific="Mr."> etc.)

But here are some of the main reasons why we probably won’t get these (or Sara’s <color> element):

The 80/20 rule

The Web exists to share all possible human knowledge. Thus, the list of possible things that we could have a semantic for is infinite. We’re already getting overload on learning or remembering our current list of elements, their semantics and their attributes. So we (hopefully) have a set of elements that express the most commonly-used semantics (ignoring historical artefacts which browsers must continue to support because we can’t break the web).

Fourteen years ago (!) Matthew Thomas wrote

The more complex a markup language, the fewer people understand it, the less conformant the average article will be, so the less useful the Web’s semantics will be.

Testing

Browsers are sophisticated beasts. I’d wager it’s the most complex software running on your device right now. As someone who used to work for a browser vendor, I know there’s a lot of resistance to adding new elements to the language – it adds even more testing to be done and boosts the chances of regressions. As Mat Marquis wrote in his recent history of Responsive Images,

Most important of all, though, it meant we didn’t have to recreate all of the features of img on a brand-new element: because picture didn’t render anything in and of itself

What’s the use-case?

The most important question: if there were a <person>, <location> or <color> element, what would the browser do with it?

Matthew Thomas suggested that new elements need to have some form of User Interface to make them easier for authors to choose the right one:

One way of improving this situation would be to reduce the number of new elements — forget about <article> and <footer>, for example.

Another way would be to recommend more distinct default presentation for each of the elements — for example, default <article> to having a drop cap, default <sidebar> to floating right, default <header>, <footer>, and <navigation> to having a slightly darker background than their parent element, and default <header>…<li> and <footer>…</li> to inline presentation. This would make authors more likely to choose the appropriate element.

As Robin Berjon wrote

Pretty much everyone in the Web community agrees that “semantics are yummy, and will get you cookies”, and that’s probably true. But once you start digging a little bit further, it becomes clear that very few people can actually articulate a reason why.

So before we all go another round on this, I have to ask: what’s it you wanna do with them darn semantics?

The general answer is “to repurpose content”. That’s fine on the surface, but you quickly reach a point where you have to ask “repurpose to what?”. For instance, if you want to render pages to a small screen (a form of repurposing) then <nav> or <footer> tell you that those bits aren’t content, and can be folded away; but if you’re looking into legal issues digging inside <footer> with some heuristics won’t help much.

I think HTML should add only elements that either expose functionality that would be pretty much meaningless otherwise (e.g. <canvas>) or that provide semantics that help repurpose *for Web browsing uses*.

So what can we do?

Luckily, HTML already has a little-known element you can use to wrap data to make it machine readable: the <data> element:

The element can be used for several purposes.

When combined with microformats or microdata, the element serves to provide both a machine-readable value for the purposes of data processors, and a human-readable value for the purposes of rendering in a Web browser. In this case, the format to be used in the value attribute is determined by the microformats or microdata vocabulary in use.

Manuel Strehl mocked up a quick example of Sara’s colour swatch using the <data> element. You could add more semantics to this using microdata and schema.org color property.

Some schema.org vocabularies do pass the Robin and Matthews’ “browser UI test” (kinda-sorta). We know that Google’s Rich Snippets search results make use of some microdata, as does Apple’s WatchOS, which is why I use it to mark up publication dates on this blog:


<article itemscope itemtype="http://schema.org/BlogPosting">
<header>
<h2 itemprop="title">
<a href="https://www.brucelawson.co.uk/2018/reading-list-201/">Reading List</a></h2>
<time itemprop="dateCreated pubdate datePublished"
datetime="2018-06-29">Friday 29 June 2018</time>
</header>
<p>Some marvellous, trustworthy content</p>
<p><strong>Update: <time itemprop="dateModified"
datetime="2018-06-30">Saturday 30 June 2018</time></strong>Updated content</p>


Google says

You can add additional schema.org structured data elements to your pages to help Google understand the purpose and content of the page. Structured data can help Google properly classify your page in search results, and also make your page eligible for future search result features.

This is pretty vague (Google secret algorithms, etc) but I don’t believe it can hurt. What’s that you say? It adds dozens of extra bytes of markup to your page? Go and check your kilobytes of jQuery and React, and your hero images before you start to worry about the download overhead of nourishing semantics.

What about Custom Elements?

Custom elephants are Coming Soon in Edge, behind a flag in Gecko and already in Blink. These allow you to make your own new tags, which must contain a hyphen – e.g., <lovely-bruce>. However, they’re primarily a way of composing and sharing discrete lumps of functionality (“Components”) and don’t add any semantics.

Conclusion

So that’s why we don’t include lots of new semantics into HTML (but feel free to propose some if there’s a real use case). However, you can do a lot using existing semantics, generic containers like <data> and extensibility hooks. Happy marking-up!

I started writing a new Mac app, and I started doing it by driving the implementation through Xcode UI Automation tests. But then it turned out I was driving the test infrastructure as much as the tests, and it’s that I want to talk about.

Given, When, Then

My (complete, Xcode UI Automation) test looks like this:

func testAddingANoteResultsInANoteBeingAdded() {
    given("An empty notebook")
    when("I add a note to the notebook")
    then("There is a note in the notebook")
}

The test case class has an object called a World, which holds, well, the test’s world. There are two parts to this.

The World holds regular expressions associated with blocks, where each block does some part of the test if its associated regular expression matched the description of the test. As an example, my test fixture sets up this association:

try world.then(matchingExpectation: "^There is a note in the notebook$",
                work: { _, world in
                guard let notebook:LabraryNotebook
                  = world.getFromState("TheNotebook") as? LabraryNotebook else {
                    XCTFail("No notebook to test")
                    return
                }
                XCTAssertEqual(notebook.countOfNotes(), 1,
                  "There should be one row in the notes table")
})

We’ll get back to how that block is implemented later. For the moment, I want to make it clear that this is a way to organise a UI test (or, indeed, any other functional test) using XCTest: it is not a new test framework. The test case class still subclasses XCTestCase, and assertions are still made with the XCTAssert* macros/functions. That’s just all wrapped up in this given/when/then structure.

Let’s look at the block’s two parameters: the first is an array of the regular expression’s capture groups so that you can find out information about the test specification, should you want.

The other argument is a reference to the World, which enables the second feature of the World: as state storage so that each part of the test can communicate with later parts. Notice that the when clause in my test says it adds a note to “the notebook”, and the then clause checks that there is a note in “the notebook”. How do they both use the same notebook object? The when clause stores it on the World using world.storeInState(), and the then clause retrieves it with world.getFromState().

Page Objects

Rather than putting XCUIElement goop directly in my test blocks, I use an abstraction called the Page Object pattern, popular among people writing browser tests in Selenium. This puts an adapter between my tests and my UI controls, so the test says (for example) app.newDocument() and the Application page object knows that that means finding the “File” menu, clicking it, then clicking the “New” menu item.

The way to create a new document in a Cocoa app has not changed since 1987 and may not change soon. But the details of my own UI surely will, and will change at a different rate than the goals of the people using it. While someone may want to add a note for the rest of time, there may not always be an “Add Note” button. So my test can continue to say:

when("I add a note to the notebook")

but the page object for a document can change from:

func addANote() {
    let app = XCUIApplication()
    let window = app.windows[documentName]
    let control = window.buttons["Add Note"]
    control.click()
}

to whatever will find and drive the interface in my redesigned application.

Would you like this?

I’m happy to package the given/when/then organisation up and release it under an open source licence so that you can use it in your own apps. As I’ve only just written the code, I’ve yet to do that, but it’s coming! I’m aware that there are multiple ways of getting/using Swift libraries, so if you’re interested please let me know whether you would expect to use an Xcode project that builds a framework, a Swift PM package, a CocoaPod or a Carthage…cart… so I can support you using the software in your way.

A (usually) weekly round-up of interesting links I’ve tweeted. Sponsored by Smashing Magazine who slip banknotes into my underwear so I can spend time reading stuff.

• Unbuttoning Buttons – how to stop a <button> looking buttony without losing its accessibility semantics
• The way we talk about CSS – “I do not think we help our cause by talking about CSS as this whacky, quirky language. CSS is unlike anything else, because it exists to serve an environment that is unlike anything else.” preaches Rachel Andrew, most righteously.
• WebP supported in Edge (Preview)
• What’s new in Microsoft Edge in the Windows 10 October 2018 Update – lots of good stuff
• Netflix viewing eats up world’s data – consuming 15% of global net traffic. Video accounts for 58% of the total volume of downstream traffic on the internet, followed by web browsing (17%), gaming (7.8%) and social media (5.1%)
• The Big Hack: How China Used a Tiny Chip to Infiltrate Amazon and Apple – Wow. motherboards made in Chinese factories had tiny chips added that were a backdoor into machines. Allegedly – see the caveats in Thinking About Bloomberg’s Report on Hardware Vulnerabilities in Servers Made in China.
• How The First Ever Telecoms Scam Worked – In 1834, the French telegraph was hacked to steal stock market data using a backspace character to cover their tracks. (YouTube video)
• Facebook’s latest data blunder is mind-blowingly bad and users should be burning with rage – “Was it really worth giving Facebook all that data, in exchange for an easier sign-up process? Especially since Facebook so clearly can’t be trusted to manage that information?”
• MSDOS source code on GitHub

When I was in Thailand recently, I was wondering whether the ever-popular Maslow’s hierarchy of needs triangle had ever been tested against Asian cultures, in which the emphasis is on family and community rather than individualism.

When I asked on Twitter, Daniel pointed me to Maslow’s Hierarchy of Need: Psychology Myth Busting #1 by Joe Leech who concludes

Self-actualisation, the idea of people becoming the best they can be is a very individualistic idea. Asian cultures are about the community and family that is collectivist in focus. Placing this very individual goal at the top highlights Maslow’s background, a man living in the individualistic USA.

There is also little evidence that the model is the same for men and women.

Nevalina pointed me to Maslow’s hierarchy of needs: An Islamic critique which concludes

It is the basic line of the Islamic approach to strike a balance between material and spiritual needs in any situation of human existence, in times of saturation and need, stability and change, health and illness, happiness and distress. A model of a hierarchy of the different needs like Abraham Maslow’s can therefore not give credit to the reality of the interaction between material and spiritual aspects of the human being in different life situations, even if the spiritual aspect was to be named first.

It’s said that Maslow was influenced by the Blackfoot tribe of native Americans, but misunderstood them. In Maslow’s hierarchy connected to Blackfoot beliefs, Karen Lincoln Michel writes up a lecture presented by University of Alberta professor Cathy Blackstock at the 2014 conference of the National Indian Child Welfare Association.

“First of all, the triangle is not a triangle. It’s a tipi,” Blackstock said. “And the tipis in the Blackfoot (tradition) always went up and reached up to the skies,” she said.

Another difference noted by Blackstock is that self-actualization is at the base of the tipi, not at the top where Maslow placed it. In the Blackfoot belief, self-actualization is the foundation on which community actualization is built. The highest form that a Blackfoot can attain is called “cultural perpetuity.”

So it looks as if a white academic male in hyper-individualist America thought that everyone in the world is like him. What a surprise. I hereby rename his over-exposed diagram as Maslow’s hierarchy of me me me and forbid you from ever using it again.

Nearly four years ago, in January 2015, I posted On Switching to Linux, in which my computer (in a photo from November 2014) looked like this:

Ubuntu Linux on a MacBook Air

Here’s the same photo from today:

macOS Mojave on a MacBook Pro

So what’s changed? In the intervening four years, I spent some time working with Linux desktop applications made of Qt, and some with browser and server applications made of Javascript. I used a GNU/Linux distribution, Windows 10, a Mac, iOS, and Android. I published two books. I took some time off. I did other things. Here are my relevant conclusions:

• Free Software is important
• Making things that are easy, or even pleasant, to use is important
• Free Software’s Four Freedoms are only academic if usability is a barrier to being capable of using the software for any purpose
• Apple, and the developers on their platform, are the sub-section of the developer world who care most about giving their people usable and pleasant things
• Combining these things leads to the conclusion that bringing Free Software principles to the world of Apple makers and adopters is both important and valuable
• Meanwhile, the people over in the web and server/backend/cloud/serverless land have done a much better job of letting makers iterate quickly and build new things
• Conversely, the people in the Apple land have done a much better job of making it so that the thing you build works without some complicated stack of transpilers, polyfills and tree-shakers.
• Thus there are things that the makers in Apple land should learn from the makers in web/server land before the Apple land merely becomes a window on to the web stuff.

I’m back. Watch this space.

Friday was my last day of funemployment – I spent the summer showing El Son the charms of Krakow, then travelling alone with my portable music studio to finish my album on an island in Thailand (it’s still unfinished), and now it’s time to get earning again. The three Cs of life (champagne, caviar and cocaine) don’t buy themselves, you know.

So today I began work with a group of old friends who put together the best resources for web developers. I’ve edited articles for them, written for them, tech reviewed a book of theirs and presented at their conference. Now they need my help with their biggest challenge — their wardrobes.

I’m bringing my experience with web standards, conference MCing and unique fashion sense to my friends at Smashing Magazine to be their in-house “Smashion Advisor”. It’s going to be a tough gig and it won’t be easy, but I’m looking forward to it.

I’ve always liked the Smashing folks. They’ve always tried to make their living the right way, with quality products at fair prices that aim to better the web, while respecting standards, audience, speakers, authors, sponsors and staff. And many Smashing staffers are old friends of mine, from even before they joined the gang.

The nice Ricardo has made me two Smashing avatars, one with a green mohawk and one with silver-flecked normal hair for when my coiffure is having a George Clooney Interlude.

See you at a Smashing Conference soon, I hope!

A few places have linked to Apple’s use of Swift in iOS, it’s useful to put it in context.

How much of Solaris was made out of Java? Almost none. There was a web browser that you’ve never heard of called HotJava, and that shipped with Solaris, but that’s it. The rest of the OS remained resolutely C with Motif (later GTK+). While Sun wanted us to believe that Java was the developer toolkit of choice, they never chose it themselves.

• Link of the week: Survival Tips For Women In Tech by Patricia Aas, one of my co-editors on HTML5
• Web Developer Representation in W3C – “the Fronteers board will propose both to become a member of the W3C and to hire @rachelandrew Andrew as our representative” – a brilliant initiative. Rachel for President! And Queen!
• Tenon’s accessible React components – Coming soon to an NPM repo near you. – I haven’t seen them yet but if they’re made by @karlgroves’ posse, they will be robust and accessible, I have no doubt.
• WAI-ARIA menus, and why you should generally avoid using them – at the recent MDN Accessibility docs hackathon we had a conversation yesterday about ARIA menus, and screenreader-user @MarcoInEnglish gave us the answer
• Tables, CSS Display Properties, and ARIA – setting a CSS display property buggers up table and list semantics. Glamorous Adrian Roselli has useful Functions to Add ARIA to Tables and Lists.
• The “Developer Experience” Bait-and-Switch – “we need to confront the “developer experience” bait-and-switch. Tools that cost the poorest users to pay wealthy developers are bunk” by Alex Russell.
• #HackOnMDN – Hidde de Vries on last weekend’s hackathon to update MDN’s accessibility information that I attended
• CSS dismissal is about exclusion, not technology – “the “debate” about CSS is not about technology. It’s about gender privilege and exclusion.”
• Responsive Images – Mat <Marquee> narrates the history of HTML responsive images and namechecks me and my “special proposal”
• Google promises Chrome changes after privacy complaints by Steve Shankland
• Former Google chief predicts the Internet will split by 2028: A Chinese Web and an American one

Hello readers, part 3, the final part of the “OOP the Easy Way” journey, has now been published at Leanpub! Thanks for joining me along the way! As ever, corrections, questions, and comments are welcome (you can comment here if you like), and as ever, readers who buy the book now will receive free updates for the lifetime of the book. While there’s nothing new to add, this means that corrections and expansions will be free to all readers.

If you enjoy OOP the Easy Way or found it informative (or maybe even both), please recommend it to your friends, colleagues and followers. It’d be great if they could enjoy it, be informed by it, or both, too!

FramerX First Impressions

I finally found time at the weekend to test out a new design / prototyping tool called FramerX. This quick blog post will cover my FramerX first impressions.

What’s Framer?

Framer is an interactive design tool that let’s you design UI & UX flows with typical design tools but also with code. While I’m not a very strong coder, having the ability to add an extra layer of detail could be a game changer. Imagine taking your designs and then wrapping all kinds of animations and interactions without hacking at it. I’m talking scrolling areas, side swiping, overlays, modals etc… It has huge potential not only to the industry but to my workflow.

My Workflow

My workflow at the moment starts with a pen and paper, moves to Sketch for the design and InVision for the prototyping. Let me just say, I’m really happy with my workflow. It’s served me well for a number of years but sometimes a new product comes along that makes you question how you work. What if I become obsolete and out of date, how will I work then? Learning something new is just as important as winning the next client.

Frames

 The first thing I had to adapt to was the concept of Frames. Everything needed to be created within a frame, which when you think about it is very practical for a UI designer. You can put frames inside frames and so on. These frames then can take on multiple personality’s, they have a scroll frame where you can insert a feed inside your main view without having to design one long page. You can add in a ‘Stack’ frame which allows you to easily distribute, position, and rearrange elements evenly on your canvas. Add images with a framed coloured overlay, add text on top of the frame. Throw in a button, Link it up… you get the idea.

From what I understand Framer used to be an app that used code first and foremost but it seems that they have now hidden the code side of things and focused on the design side. I guess they must of seen apps like Sketch, InVision Studio and Adobe XD doing really well and wanted to join in. Framer have made this look beautiful. It’s the nicest UI tool I’ve used, the light skin especially just ticks a ton of boxes for me, it’s simple yet complex and has a world of depth that I may never discover.

Store

Another thing that stood out to me was their Store. This is a marketplace of packs and elements that you can use to add to your design, you can download packs from amazing teams like Dropbox or Unsplash. Each of the elements has been specially designed to be interactive within your design. Take a on/off switch. In Sketch this would be two screens linked together (one for one, one for off) in Framer it’s a working-actual-button. It’s amazing. It just works beautifully.

The Store did have issues for me, for example you add multiple packs and there’s no search or filter to find the elements you want. The previews are small and hard to see and you have no idea of what you’re getting in each pack other than a small graphic the team produces for their store front. But I’m sure this will improve and as more teams join in, the more high quality content will appear. From what I can see right now though is that Framer may need to take a Slack approach and slow down submissions as the recent downloadable items section is BUSY. I have no idea on the quality of the pack other than how many users have downloaded it.

Previewing

A further negative for me was the previewing of your designs. It gives you a QR code and a web link to check things out. The QR opens the app if you have it installed and that is a much nicer experience than the web link. The web link didn’t seem to have any presentation or device border. It’s live which means as you click around the preview changes which sucks when you want to send it to a client to preview. I’m sure this issue has been solved and I just simply haven’t discovered it yet but I can already hear the confusing client calls coming my way.

I also found if you used certain packs from their store it would throw up a error and render a blank page. Now to coders this wouldn’t be an issue as you probably understand what the error means but for someone like me, this was tough to figure out. Framer makes everything so easy to do so probably need to work on error codes for thick people like me.

Cost

FramerX is $12 a month if billed annually, $15 if billed monthly. Compare that to Sketch at $99 a year I think it’s a good deal. The big question I have is whether I’d make the full switch or just use it to flesh out some of the more complicated UI projects I get tasked with. As it stands I’m not sure. I may wait 6 months to see what updates they release.

I know this is a very vague first impressions and probably glossed over a ton of stuff I’ve yet to discover, but to summarise. I’m VERY impressed with FramerX I just don’t know how it fits in with my workload and client list just yet.

—

Don’t forget to check out my latest Blog. Reflecting on 10 years as a freelance designer.

The post FramerX First Impressions appeared first on .

There always seem to be two schools in software, though exactly where the gates are varies. Alan Kay described how Edsger Dijkstra noticed that “the Atlantic has two sides”.

It was basically all about how different the approaches to computing science were in Europe, especially in Holland and in the United States. In the US, here, we were not mathematical enough, and gee, in Holland, if you’re a full professor, you’re actually appointed by the Queen, and there are many other uh important distinctions made between the two cultures. So, uhm, I wrote a rebuttal paper, just called On the fact that most of the software in the world is written on one side of the Atlantic.

Or maybe both schools are on the same continent.

The essence of [the MIT/Stanford approach] can be captured by the phrase the right thing. […] The worse-is-better philosophy is only slightly different […] and I will call the use of this design strategy the New Jersey approach.

Or they could be ways of thinking, school curricula, or whatever.

Maybe both schools have something to teach us. Maybe it’s the same thing.

Reflecting on 10 years as a Freelancer

2008 was an awful year. I was made redundant and lost my dad within months of each other. My dad plays a huge part in why I’m a freelance designer today but we’ll jump back to that later. 

Losing my job was tough as I’d fought for years to get to a decent wage, I’d started on £10k a year which was about half what our college had suggested most jobs start at. It took to 6 years to get to a wage that I was happy with and then, GONE! The business merged with another business to take on a larger project, but that business had huge hidden debt and our little studio was one of the first casualties.

One of the designs I’d create for myself.

My dad had always been self-employed, I’ve never given it much thought until writing this but yeah, I’m just like him. He started a butchering business when I was young which was doing well until the big supermarkets like Tesco’s, Sainsbury’s and Morrisons (Safeway!) became popular. One thing lead to another and as businesses do the business ran into debt, rather than fold the business like many businesses would today my mum and dad sold everything to clear their debt, including their beautiful house in Knowle, Solihull which by todays rates would be worth around half a million.

Long story short, we survived and had a lovely life. They did everything for me and my sister and can’t thank them enough for it.

While my dad was ill I was really down with my job and looming redundancy, he suggested I was talented enough to do it on my own terms and I should consider starting a business offering design services. It was only after he passed away and I was jobless that that conversation came back to me.

Yes, Let’s f$cking do it.

Another very early design back when iOS was all bevels!

Dave Smith, a friend and cheeky spurs fan I used to work was looking to do something new and after a few discussions we started ‘Sans Deputy Creative’ which was a independent design agency.

TIP 1: Don’t start a company with a name that people can’t spell, or even understand.

We’d hit trade shows and really beg for work, the first few years we would earn about £6k a year, it was shocking. We were fresh faced and eager to do the work, I often think if businesses took advantage of that fact and hammered down our prices. Dave soon went onto better things, landing a cool marketing role in Birmingham and with the words of my dad still ringing in my ears I decided to stick it out except dropping the Sans Deputy name and just trading as my name.

TIP 2: If you’re starting on your own, use your name, businesses will want to work with you more if you sound and act like a freelancer.

Before Dave left I’d started designing apps for my own pleasure, this is before I even knew what ‘UI Design’ was let alone ‘UX Design’. I just loved apps. I’d use them all the time and many I’d be using looked terrible so I just got creative with them. I added them to Dribbble and my website and thought nothing of it. I’d created a game called Directional which didn’t make any money but had 50,000 downloads which helped get my name out there.

Our STA app design, my first commercial project.

Me and my cousin Roy Goode (A brilliant developer) landed our first commercial app design and build for the Swimming Training Association. We’d pitched and won. A whole new experience and we loved it. It was a long process and I learned lots about talking to customers about their app requirements and how important working closely with a client was.

This experience urged me on to add more app designs to my website and work heavily on SEO. I’d designed and created Howler, a collaborative joke writing site with friends Martin and Lee, which did well but alas, never made any money… but I just loved creating things for myself and it seemed to work. Next thing I know BOOM! Google loved me.

Tip 3: Focus on what you love doing, I stopped building websites because I was bad at it and didn’t care for it. I switched to only doing design and not looked back since.

I was quickly getting lots of enquires from all over the world. In fact at one point in the 2015/2016 period I kept a record and had over 500 enquires that year. I’m a fast worker but there was no way I could keep up and I have no desire to build an agency like we tried with SDC.

I put some of this success down to my design style. Apple had just launched a new much cleaner and white looking iOS and all my work was in the same style so the enquires flooded in.

TIP 4: Not all enquires are good ones, you will get lots of terrible ideas, time wasters and scammers. Don’t work for free. Don’t work for fools.

The early days of being a freelance designer were tough. REALLY tough but once I found my stride I was beginning to love the lifestyle. I’d managed to make some amazing connections at home and in the US (shout out to Eric, Mike, Tom, Nick, Neil, Matt & Rob for believing in me and keeping me busy) and was working on some really cool project that I’m still proud of several years later. I’ve even had multiple job offers over the year which I’ve rejected as they’ve just not been right (or needed me to move somewhere cold!)

I designed and paid a developer to build this game, 50k downloads.

I found that keeping a strict routine was key to getting things done. I’d force myself to be at my desk in the mornings and built that into habit, it’s very easy to let routine slide when you work for yourself. I work best when people need things from me so I’d make sure everyone in the project was connected, communication for remote workers is mega important. Thankfully in 2018 we have amazing tools like Dropbox, Slack, Trello, InVision to make freelancers feel more connected than ever.

TIP 5: Ask ALL the questions you need answering to do your job, don’t be shy – just ask.

10 years later I’m still a freelancer, I’ve got loads of experience and doing more consultancy work than ever advising startups and tech businesses on their digital products. I’ve not done this by myself, my wonderful wife has always supported me, my mother reassures me, my close friends Lindsay, Stuart & Alex are always there to moan at. Old clients become friends and share the experience with me. Even my dog keeps me sane.

TIP 6: Freelancing can be a team game, except your team isn’t your work colleagues it’s your friends and family. Always ask for help or someone to listen.

 

Me on one of my many home offices over the years.

Freelancing isn’t easy, there’s lot’s of negatives that I’ve not talked about (and could be a whole blog post in itself) but if you have the ability to stick out the tough years and the lifestyle suits you then freelancing is a great adventure full of twists and turns.

I’ve posted lots of the subject over the years such as ‘How Twitter made me a better freelancer’ and ‘Seven ways how to manage your design leads’.

Will I be here freelancing in another 10 years? who knows… depends if someone offers me a job I can’t refuse!

End Waffle.

The post Reflecting on 10 years as a Freelancer appeared first on .

I think every few years I’ll be destined to make a blog post that starts “oh I have a blog don’t I.”

You can now get the chapter I wrote about context steering in Game AI Pro Volume 2 for free on their website:

http://www.gameaipro.com/GameAIPro2/GameAIPro2_Chapter18_Context_Steering_Behavior-Driven_Steering_at_the_Macro_Scale.pdf

Today I came across the site Danny Reviews, at which fellow internet Danny Yu has posted over 1400 book reviews. I realised that if I had posted book reviews of every book I have read since I became an internet, I would have more than 900 reviews online, maybe over 1000. How do I know? Because my GoodReads profile lists those 900 books.

Now actually GoodReads are quite generous in their terms: I own all of the information I’ve posted there, and I can export all my books, including my reviews such as they are. But that’s entirely up to GoodReads, they decided to be nice and provide an export feature. Other sites take their digital sharecropping more seriously.

I got lucky, but we should all think carefully about what we’re posting to where.

Parts one and two of OOP the Easy Way are now both complete. Part three will be underway soon, in the meantime you are welcome two read the first two parts on Leanpub (and will automatically be entitled to updates as soon as they are published, for free, for the lifetime of the project). All feedback is always welcome.

Last month, I asked whether Freedom Zero is such a great idea, whether it’s OK to limit the freedom to use the software for any purpose if you dislike the purpose to which you believe someone will put it. I gave the example of the Numerical Recipes licence as one that could be adapted to this situation.

In summary, the licence would say “you are free to read this code for the purposes of understanding it, to share the code, and to contribute changes to the code. Should you wish to use the code, contact me, we will go through some customer due diligence, and I will decide whether I want you as a customer”. So far, so unexciting: imagine the usual SaaS startup pricing page with two pricing levels. The “Basic” tier is free, and scales up to 0 uses. The “Custom” tier is $contact_us pricing, and scales up to $contact_us uses.

The Lerna project was briefly licensed under a different model, which took a different approach to solve the same problem. Their approach was “you all get to treat this as a free software project, except the named organisations, who don’t”.

Just to get this out of the way as many of us are techie people who enjoy picking nits: this approach doesn’t appear to solve the problem that the author was setting out to solve. Everybody else except @evil_corps get the software under the terms of the MIT licence, @evil_corps do not get to use the software at all. Now because I got it under the terms of the MIT licence, I am free to do whatever I want except blame the authors if it doesn’t work or remove the MIT licence. This means that I am free to give it or sell it to members of @evil_corps.

Lots of people disagreed with the idea that the Lerna project maintainers, or I, would seek to restrict freedom for moral/ethical reasons, because restricting freedom itself is a moral/ethical choice that is objectionable. Unfortunately, the argument that is often advanced is a bad one.

Richard Stallman’s Why programs must not limit the freedom to run them says numerous things:

1. The bad actors will probably ignore your license terms anyway, so why bother? This pessimistic view could equivalently be used to argue against any commercial terms (bad actors will pirate your software anyway, so why sell it?) or even RMS’s own General Public License (bad actors will ignore the copyleft requirements anyway, so why bother?). In fact many actors voluntarily comply with the GPL without being asked, many compliance requests are resolved voluntarily on notification, GPL compliance usually starts with a polite, private request not a lawsuit or public shaming. So evidently bothering is useful.

2. Using copyright to restrict usage is abuse of copyright. But so is copyleft, although as it’s a “good” abuse of copyright that RMS approves of, he’s OK with it.

3. Limiting freedom is a slippery slope to not being able to build a usable combined system, because you would have to check all the licences to know whether you could do anything. RMS does not have a beard, he has a facial hair, and another facial hair, and another, and so on.

4. You shouldn’t have the right to do that.

That last one is an interesting one that RMS doesn’t go into in depth, I would imagine because he considers it inalienable. He wrote Freedom Zero, of course he believes in Freedom Zero.

Brad Kuhn, on the other hand, has written about whether I should have that right, and his post is an interesting one. He uses the example of the ACLU’s defence of free speech to argue that having a simple platform and universally supporting a simple principle creates a powerful reputation from which to then build other principled arguments.

I think that argument is compelling, and it has brought me back round to wanting Freedom Zero again.

Fitness Activity UI Design

This project is a personal one aimed to bring groups of like minded people together with one goal, get fit together.

Sometimes being in a new city, away for travel or just in your very own town can be tough to find people to exercise with.

This app is designed to bring people together by giving over your location, seeing who’s near you and if any events are on that you’d like to join.

The app will be purely fitness focused, so if you’re into yoga you can tailor the app to only feature yoga people, or if you like to try everything then you can access that too.

Plus! You can manage and control who comes to your events, so you have ultimate control with the people you invite to your group training.

While this is work in progress I’m excited to show off a few key screens.

More soon

Pssst.. Find out how Twitter has improved me as a freelance designer

The post Fitness Activity UI Design appeared first on .

Prempoint App Design

Prempoint is a hot startup from Florida, US. Prempoint are pioneering how property managers and real estate agents automate property access, making showings, maintenance and resident access as simple as opening an app.

Prempoint originally worked with me way back in 2015 where I designed some proof of concept UI. They went on to release version one which helped them secure some investment.

Co-Founders Matthew Hartley and Paul Ward approached me again in 2017 asking for a slick interface that was easy to use, it sounded like a challenge I’d love to work on so I jumped onboard.

There were many challenges I had to tackle for this UI design. First I had to completely re-imagine the UX flow and how the primary user added devices, accessed devices and communicated with people within the app.

I knew we wanted a grid approach as it felt the most customisable for the product, a grid put simply could be as many or as few as the operator required.

Prempoint isn’t just locks. Prempoint will work with all kinds of Bluetooth/Wifi controlled devices, so we got creative with the dashboard and created an interface for each of the device types that would be easy to use. We knew that if we over complicated the device controls it would lead to confusing actions and mistakes. No property manager wants to leave doors open!

One of the joys of working on this project was how enthusiastic Matt and Paul were for their product, they challenged me at every step of the way which resulted in a really tight product.

I loved how it ended up looking.

—

Interested in becoming a a *better* freelance designer? here’s a little guide.

The post Prempoint App Design appeared first on .

To promote NatWest’s secure app, which uses facial recognition security to tell who’s who and keep your money safe, we worked with Zenith, DCM and...

The post Facial recognition for movie stars and sporting heroes appeared first on stickee.

Every now and again it’s useful to display single-colour emoji on a web page; all the colours in those little emoji symbols are nice and all, but it does occasionally make your formal document look a bit like an angry fruit salad. I’ve seen a technique for this before (in particular from Bram van Damme, but searching for “emoji silhouettes” finds lots of other people doing it too), where you set the text colour to transparent and then set a text-shadow, and you’re done. This is nice, but it doesn’t work for me in Firefox, sadly; if you set the text color to transparent then indeed your emoji disappear, but if you set a text shadow they come right back, and in full colour.

So, I do it a different way, akin to the ancient and well-known image replacement method; set a text-indent on the element containing your emoji and then reverse that text indent in the text-shadow‘s offset-x position. So you set text-indent to something massive and negative like -2000em so it’s definitely off the page to the left, and then a text-shadow (which, we recall, is specified as text-shadow: offset-x offset-y blur-radius color) of plus 2000em to put the text shadow back where the original characters were before they were indented miles to the left.

<style>
span.emoji {
    text-indent: -2000em;
    text-shadow: 2000em 0 0 red;
}
</style>
...
<p>And here are some emoji silhouettes:
    <span class="emoji">🚀 🎭 </span>.
    Aren't they nice!<p>

And here are some emoji silhouettes: 🚀 🎭 . Aren’t they nice!

You have to wrap your Unicode characters in their own little span, which is a bit unfortunate, but then you have to with other approaches too. (And your span has to be display: inline-block or block too, otherwise the text-indent gets ignored.) Anyway, not earth-shattering, but I quite like it.

After this was originally posted, Garrett LeSage suggested a different approach, using CSS filters. These are quite a lot more powerful than one might think. His approach applies a set of CSS filters in concert, like this:

Set the contrast on your emoji to high with CSS filter: contrast(0): 🚀 🎭

Use a sepia(100%) filter to colorise: 🚀 🎭

Set the colour to one of your choice with hue-rotate(180deg): 🚀 🎭

And finally pump up the saturation with saturate(1000%): 🚀 🎭

The up-side of this approach is that it’s one line of CSS; you don’t need to set inline-block, or worry about defining a width on your “emoji” element. The down-side is… well, you may be thinking, “where do we specify that we want the final colour of the emoji to be red in that code above?” And you would be right. You have to do some crazy maths calculations to actually work out how to set your emoji to the colour you want. Barrett Sonntag wrote an interactive filter generator to calculate the set of filters required to set your colour to the thing you choose, based on some Stack Overflow answers. I think this downside is enough to lean me away from this method, personally, but it’s another approach if you prefer it!

PROVEIT Game Design

PROVEIT is the first US app that lets you play daily trivia against your friends for cash prizes. Whether you love Seinfeld, Science, or the Super Bowl, someone’s waiting for you to PROVEIT.

I love it when I get recommended to work with awesome tech teams all over the world. This recommendation came from Matt at Prempoint suggesting I needed to work with his friends Nate and Prem on their new trivia quiz game.

Once introductions were made I was quick to jump onboard and work on this exciting project.

I started by designing some concepts of the new app. We wanted to focus on how the game could look in several versions time that included licensed sections, promoted content and huge tournament challenges. The concepts sparked lots of excitement and debates, the design needed to tick a lot of boxes – not only visually but legally. We felt the best direction was to make it as social as possible, that lead to seeing who was playing the games, how many were playing and easy to access friend challenges.

I was given lots of creative freedom and designed the whole UX flow from sign up, on-boarding to winning your first game. It was a great experience and I’m proud of the final product.

It’s only available in the US for the moment, but keep an eye on this team as they’re doing some great things in the quiz space.

Interested in Puzzle games? try some of these

The post PROVEIT Game Design appeared first on .

As in 2016, I entered the 2018 LOWREZJAM on itch.io, a game jam where you have to build a game which runs in a 64x64 pixel square. So, really small — the Game Boy was 160x144, or about six times as big. So you’ve not got a lot of space to do things, but then constraints are the mother of innovation and you do get some really interesting game concepts! So, here are my reviews (which are also posted to itch.io so the developers get to see them; you can only rate and review as part of the jam if you entered your own game, which I did.

I’ve only rated games which are browser playable, mainly because there are loads of entries and I have to find a way to cut them down somehow, the reviews are in no particular order, and I didn’t quite get to them all (I nearly did, so apologies if I didn’t get to yours). Some thoughts on the jam as a whole after the reviews.

Block’ed

Honestly, I don’t understand what I need to do here. I can move my little robot around, and I worked out that I can pick up the little collections of 3 rocks (?), and when I put that collection back down again it seems to have turned into a red block with an exclamation mark on it. But I don’t understand what’s going on. This feels like it could be a really quite nice puzzle game, but the initial hurdle to get into it is too high. A set of tutorial levels which introduce the concepts would be really, really useful here. And this has, I admit, suffered because it’s part of a game and I have nearly 100 games to review, for which I apologise. If this gets some tutorials, and once I’m in a little less of a rush, I’d be happy to play this again and see how it feels!

Donuts Rage

A game where you have to tap the buttons as fast as possible! In pixel art graphics with 8-bit-ish beeping sounds! Makes me feel like I’m playing Daley Thompson’s Decathlon in about 1986. Anyway, the graphics here are pretty nicely done. The gameplay isn’t very engaging; tap the buttons as fast as you can, and eventually “as fast as you can” is not “as fast as the game wants you to” and you lose. This feels like it might be a nice brief diversion — a quick minigame embedded in something larger, which is a pretty good goal for these little 64x64 games. Good work for what it is!

Lydian

This is excellent. Hack-and-slash, as it says, but really well implemented; the graphics are evocative despite being pixelated, the storyline is good (she got her daughter back! yay!), the music is cool (especially the title screen), the monsters are scary, the fighting is well done, the mysterious spirit between levels that gifts you new weapons is mysterious (why’s it doing this? Not that I want it to stop, you understand). The best of the old pixel art games managed to make their characters expressive even though they were only a few pixels tall, and this succeeds in that too.

A couple of minuscule issues, none of which harm the rating. I didn’t at first grasp that the weapon switcher (from pressing Space, which was very clearly indicated with the little space bar keyboard graphic, well done) needed me to hold space down and then use the arrow keys; I was just hitting space expecting that by itself to switch weapons. Maybe show left/right arrows on that screen too to indicate that? Tumbling/rolling seems to be a bit sensitive to the order the keys are pressed in; pressing z and then an arrow key does a little roll in place, whereas pressing an arrow and then z does a proper roll as expected. Perhaps this could be tweaked? This didn’t matter that much to me because I never needed to roll, or to use the health potion (was it a health potion? I guess so, but I didn’t use it) because of the final small issue: if this does become a real game, the ice axe is waaay overpowered. I loved the implementation — it was clear the ice axe was an _​ice​_ axe, and I like a lot that you can kill things without having to be horizontally aligned with them which most games of this sort forget to do — but once I had the ice axe, all the battles were super easy. That’s fine because the idea of this is to tell the story rather than being a challenging battle in itself, but that may not apply if this becomes a fuller game.

The developer also is very responsive; I found some technical issues with the game (as in other comments) and they were quickly fixed, which is good because it meant I got to play this.

Anyway, great work.

Hike

This does an excellent job of being unnerving to play. I found myself twitching at every even slight noise. The standing people — are they people? are they cardboard cutouts of people? — seem rather silently menacing. Great atmosphere, and good sound design. It’s hard to tell quite what’s going on, which is a function of the very low resolution, but that’s what lowrezjam is all about, so that’s OK. The controls are really too sensitive, though; I found it hard to control where I was going because a tiny move of the mouse would spin me halfway around the screen, and I’d lose track of where I was facing. This is more of a problem with a game where looking back means you die…

JAM in 64 Seconds

This is a neat concept. I really like that the screen ends up filling up with things you haven’t dealt with — work emails, dog leavings, and so on. And I laughed out loud when doing the “coding” section and an actual bug appeared that I had to get rid of. This is, despite its 64px nature, a terribly accurate description of how writing a game for the jam actually is! Nice work. The graphics were rather blocky and difficult to grasp, though — this is something that a graphic artist could doubtless improve on — and sometimes clicking on things didn’t seem to register which meant that in the first playthrough I didn’t realise that you could click on things to remove them (and so I lost very quickly). I got the hang of it, though; I’ll keep persevering to see if I can actually finish a game now :-)

grav-racer

Seems an interesting beginning to a game concept, and embracing Rust compiling to webasm and webgl is pretty cool. This could be good stuff when it’s finished; as it is, it’s more of a prototype, of course.

Set Fire to the Empire!

Cool music. I like the idea here, too; simple but good fun. It’s a bit hard to actually stay ahead of things, though, so it devolves rather into button-mashing, but that’s maybe the goal here. And the main player sprite is impressively expressive for being only about 5 pixels high!

For the Demon Lord

This is more detailed than I thought it would be at first. It’s essentially, tower defence; you’re attacked by an endless wave of heroes aiming to smash your collection of crystals, and you create monsters to fight back against them; your monsters are confined to the square they’re on, but you can upgrade them with points. Points (well, “souls”) get generated by your crystals, so you have the normal tower-defence decision to make, of “do I have a whole bunch of quite rubbish monsters”, versus “do I have only a couple of monsters but upgrade them continuously until they turn into the Hulk”? And I’m not sure which is actually best here, which is a good sign. The upgrade tree is complex, though; all created monsters start as a blob, and depending on which of their stats you upgrade, they turn into a variety of different monsters, and I never had a very good handle on which collection of upgrades turned my blob into a mega blob, or a skeleton, or a demon. It would be good if there were some sort of on-screen indication of where the next upgrade or upgrades will occur and what they might be, so I can choose to evolve in a different direction without having to try to make notes about what the upgrade tree looks like. One of the upgrade paths even leads to crystals, interestingly, so you can breed more crystals to get more points, thus regaining your power source after the heroes have destroyed some of them. This is a good mechanic, and I liked the ideas behind this game quite a lot. It suffers from the 64px restriction, though; the playfield is bigger than the screen, so you end up scrolling around the battlefield while looking at it through a pinhole, which is pretty annoying. But that doesn’t affect the core gameplay much, and I like the core gameplay. Nice work.

Also, since I’m a developer and all, I thought, hahaha, I’ll just stop the game in the debugger and give myself 100,000 souls and then I can upgrade everything and win massively. I was rather crestfallen to find out that the hero generation rate is actually tied to the number of souls you’ve got, so my little hacking adventure lasted about a minute before an unstoppable wave of hero death overwhelmed my monster force faster than I could upgrade them or add reinforcements. Very clever, developers. :-)

A lot of time.

I didn’t realise for quite a while that the “hand” icon actually is a hand, so I couldn’t do anything. Once I’d worked that out, it helped. I don’t understand the gramophone, though; I can put records on it, but then interacting with it just takes them back off again. The game kinda illustrates ennui and loss through actually making the player experience them, which is a technique I can’t decide whether I like or not. The graphics for the rooms are nicely implemented; objects not quite so much (I had no idea the records were records until I worked out I could put them on the gramophone, and the dog is… kinda representative of a dog. But when you’ve only got 15 pixels or so that’s probably the best that’s doable!)

Sherlock Jack

Simple concept — walk around a slightly confusing maze of paths, kill the monsters that get in your way, and find clues. The “tracker dots” around the edge of the screen are useful, since otherwise exploring the maze would be really frustrating. However, there are some usability issues; if you walk into a wall you tend to get “stuck” on it and have to back away. It would be much nicer if you were to slide along that wall rather than getting stuck on it; especially since you can only walk in 45-degree directions and the tunnels in the maze are at different angles, meaning that just walking is often joggling the keys to approximate that diagonal. This isn’t the fun kind of challenge :) Also, walking down a tunnel only to find that it’s a dead end is an amusing thing the first time but gets really tiring after that, because it’s just annoying; all you can do is retrace your steps. I like the Sherlock framing, though, and the “cheat” button was very much appreciated!

Tank Raid

Flagrantly and unashamedly violates the 64px rules; the rounded corners on everything and the wheels on the tank in no way conform to the 64px grid :-) I never really got a sense of why my “special attack” misses lots of the time; that’s not very special. Fun little game, though; I got quite into the strategy of whether to shield first and attack afterwards, and who to attack. And the graphics would be quite nice, in a jam which didn’t have the pixel restrictions. It’s worth ignoring the 64px thing, fixing this up to have nicer fonts and so on, and then releasing it, I would say.

Beat the Glitches

I think a game which shows glitchiness with corrupted graphics might want to pick a jam where it gets more screen resolution to play with, since it’s hard to tell whether a thing looks wrong because it’s “corrupt” or it looks wrong just because it’s hugely-inflated pixel art :) Anyway, basic gameplay seemed fine, but I never grasped whether there’s a point other than “keep killing the monsters until eventually you die”. I thought that the “green arrows” which appear were telling me a direction to go, but now I think that they just sometimes appear when I kill a monster, and I don’t know why. In short, a good proof of concept, but it needs a lot more before it becomes an actual game.

Arctic Arctic Adventure

Simple concept but a reasonable one; collect bullets and throw them at invading walruses before they eat all your ice. The bullets are actually curry, rather weirdly — do penguins particularly like curry? do walruses particularly not like it? — but the main problem here is that the walruses appear and then disappear waaaaaay too quickly. Either you need the reflexes of a particularly quick-moving cobra to play this, or I’m doing something wrong, because I hardly ever managed to get into position and actually hit one of the attackers before they vanished again, which puts the game too far into the “frustrating rather than fun” category. Nice idea, though; it’s quite reminiscent of the sorts of 8-bit games you actually got in the 80s.

Outer Space Problems

Turn-based fighting; a board game, essentially, but with an outer-space theme. It’s quite fun to play and there’s an interesting variety of movements and skills — some ships have a shield, others a laser, or the ability to “hack” which is actually altering the turn order. It’s also presented in isometric rather than overhead view, which is unusual in this jam; it’s a clever idea, but I think it might be unusual at 64px for a reason, because if you’ve got two ships, one behind another, it can be quite confusing to see what’s going on (where this would likely be a lot clearer with more resolution). Nonetheless, this is a complete game, nicely explained, fun to play, and with simple but good audio. I also found all the text very easy to read, which hasn’t been the case for a number of games I’ve played in this jam, so that’s a good piece of design too. (And I appreciated the use of text (“ATK”, for example) rather than some hard-to-identify icon!) Two thumbs up!

Tactical Air Support

Fly around and bomb things; an overhead plane game. Neatly done; this was actually quite good fun, bombing their tanks, and it was nice to see (realistically) that a bomb which lands near a tank swallows up that tank in the ensuing explosion. The description explicitly states that slowing your plane down is a good idea, and it is not wrong about that; I can’t help think that it would be easier to just start the plane at minimum speed rather than telling people to do that in the description. Graphics are a bit blocky and basic; some antialiasing would help here, I think. But the game is smoothly done, and fun to play, and that’s all good with me!

Infinitroid

This is, well, it’s Metroid-style, hence the name! Basic mechanics are sensible and easy to get a handle on (although I always take a while to get used to jump being a key rather than the up button), and I was soon bouncing all over the map shooting things. Those little gun turrets that don’t wake up (and are invulnerable) are really irritating because every time I jump to wake them up they fling a bullet directly into me, but that’s not the game’s fault, that’s me being rubbish :) I have a bit of a complaint in that I didn’t really have a good sense of how well I was doing; the “readout” section at the bottom of the screen is rather abstract, so I didn’t really know what my health was, or what difference collecting the different-coloured drops actually made to what I was doing. The sound is very PC-speaker squeaky; lots of seemingly unconnected beeps, so I didn’t really gather what they all meant. Fun little game, nonetheless!

Corrupted Space - LOWREZ edition

Walk around, touching every piece of ground to remove the bacteria near to it. It took me some time to realise that the bacteria grows back after you’ve removed it, meaning that you end up going over and over the same bits of the level trying to get it all clean before the first bit you did grows back; rather like painting the Forth Bridge, where once you get to the end you have to start all over again at the beginning. And once you get a few levels in, there are enemies that fire bullets which kill you (which is fine) but you walk faster than the bullets fly, so if you insert yourself into a bullet line and walk along with it, you end up walking into the bullet in front of you (and dying), which is pretty annoying. Although that’s likely my fault because I’m not good at this sort of twitch reactions game. The implementation is flawless as far as I can tell, graphics and music and all.

Prim d’avust

Impeccably implemented sliding 15 puzzle. Cool music, too. I am ashamed to admit that I didn’t get very far because I’m not very good at 15 puzzles, especially when the image is as abstract as this, but that’s not the game’s fault (and you even give a little sound and flash when a piece is in the right place, so there’s no excuse). Well done. Also great to see Godot being used; as someone who’d like to experiment with Godot I’d be an eager reader of a really detailed devlog explaining how this was built, how it was restricted to 64px, how you made it expand to a larger size on the page, and so on!

Insta Quest

What a nice departure from the normal type of game submitted to this jam! I enjoyed playing this; it’s clear what to do, and the mechanics are obvious and make sense. Also, I have terrible reactions and I should work on that. Good game; some audio would be a good addition, but the developer’s said that the game’s still being worked on, so that’s OK.

Seasons of Fortune

I was getting my one fortune a day for some days before the jam voting even opened :-) Nicely implemented, and the “one a day” trick (which is really the fundamental thing this does) is unusual to see, and quite good. The game suffers quite a lot from text not being very readable; a different font might help with that a little, perhaps? Other games also have the problem, but they’re not quite as centred around definitely reading the text as this is. I mean, it’s not a game, per se, but it’s well done for what it is. Good work.

Soldier 64

This feels (deliberately, I expect) very Spectrum-ish as a game, especially the colour blocking and font. It’s very basic, but it certainly works; I remember playing games similar to this back in the 80s. The music is a bit too repetitive, but for what this is the game certainly works.

Match X

Something like the venerable “Same Game” puzzle, but with a larger playfield comprising pixel art pictures. This is a take on the puzzle I’ve never seen before, and it’s surprisingly difficult, which is refreshing. It’s also very useful that you don’t have to entirely clear the playfield to progress; getting down to four pixels or less is fine, which is good because I’m not sure that some of the levels are actually completely clearable. I was expecting fallen columns to slide to the left to avoid leaving any completely empty columns, and they don’t, which made solving the first level more difficult until I realised that! But the game works, and it’s good to see new approaches to old ideas.

PIXEL ISLANDS

Not a game, per se; it’s a procedurally-generated landscape you can walk around in. Technically impressive, although it suffers rather from being bounced down to 64px — the resolution’s just too small to properly express the design, and so the screen does occasionally feel like it’s dissolving into random pixels. The audio is nicely done too. This would be an impressive base for an actual game to take place on, or done as a non-interactive art piece.

Silver Rule: Prologue

An interesting premise; you’re preparing to embark on a great quest. Unfortunately, you’re pretty lame, and so even passing the initial test is a challenge. This is partially because the vermin you have to kill move really fast, and partially because your magic power is rubbish; to attack an enemy with the default fire spell you have to be really close to them, and if you get that close you’re likely to touch them, which (a) costs you health and (b) more annoyingly, thrusts you away in a random direction, so you have to approach the enemy again, causing the same problem. This is improved a little by the second magic skill, which actually fires bolts of ice from a (short) distance. Over time your magical abilities wane, but there’s a little minigame that I’m very impressed with where you literally descend into your own psyche and chase away bad thoughts, clearing your mind and restoring your magical power. I like that idea a lot; very cool. Those bad thoughts also move really fast, but the minigame is easier because it’s in such a constrained location. I kinda got the feeling that you get when you play games originally intended for a 386 on a modern computer and everything’s sped right up; I’m sure this wasn’t intentional, but it feels rather weird. There is definitely the seed of a good game here, if the balance can be worked out (and the graphics made a little less blocky, perhaps). And the developer explicitly calls out that this is a work-in-progress, so fingers crossed for the improvements!

dot.Market 2

What an intriguing idea! I’m glad the tutorial was below the game or I’d have had no idea what I was doing, but this is pretty interesting. I don’t think I quite get the idea of price fluctuations, though; if I go away to make a cup of tea, do the prices change? Or do they only alter when I do things, like a stock market version of Superhot? Nonetheless, this is fascinating, and quite different from most other games; bonus points for idea creation here, and the pixel art editor is well-done and easy to understand.

Labyrintho - Low Rez Edition

A prototype, as the developer says, but surprisingly atmospheric. The clock tick is simultaneously quite unsettling, after a while, and a sign that you’ve ended up back in that room again. I should really make a map. Nicely implemented, and the graphics are excellent; you’d hardly know that it’s only 64px square, although this is helped a bit by the “saminess” of them all; walls and floor and that’s about it :) If this can be made into a small game and keep the atmosphere, it’ll be good, I think!

Sidestepper

Impressive for being 1KB in size!

Mini Organizer 3000

Nice variant on Sokoban and similar games. Some of the later puzzles are actually pretty tricky, which is good. No great shakes graphically, but it doesn’t really need to be for this sort of game to at least be playable! Nice work.

Fibonacci Box

Ultra-minimal but very clear. This is a good demonstration of how you don’t need good graphics to have good gameplay. And (I admit this sounds a bit stupid) the graphics are good, given the overall constraint of the game; something about the colours chosen or the widths of everything, but it just looks right. The physics is annoying, though; I keep falling off the edge of platforms, or finding it very difficult to move only a few pixels to left or right, and that’s just not a challenge I enjoy; it just makes me frustrated. I think I like my puzzle games to be puzzles and not require pixel-perfect moving. I don’t know whether this is a fault in the game or in me, though. Still, this is good stuff.

Fedora Rise

Hammer your space bar to raise your avatar’s fedora. I feel like this is an in-joke that I’m not in on…

🔦

As the game itself describes, it’s a tech demo rather than a finished thing. Cleverly done, though; the devlogs are fascinating. I had no idea that bitsy could even do things beyond the most basic of 1981-era games, let alone that there seems to be a community of people working on plugins/extensions to add more stuff. That’s neat. I need to look more into this.

UNLOCKR

Nicely implemented. It’s not difficult, per se — the only threat is overshooting — but the movement is very smoothly done and fast, and feels very tactile. The sound design plays into this well with the soft clicking as your lock spins. The music is perhaps a little overpowering. This would make a nice little minigame somewhere in a larger game, or as the method to open doors in such a game, or similar. Nice work!

Petoink

Weird premise (inhale ink? spit it at enemies, which then turn into ink? and that ink powers the ship?) but executes well on it. And as there are multiple ink colours it becomes a little bit of a puzzle game about resource management. The graphics are well done; shame there’s no sound!

Tafl

Excellent board game. This is a tafl game, from a long tradition; it’s a kind of small-board version of hnefatafl. Good fun to play, although the AI is not very sophisticated; I spent time being really careful about moving my king until I realised that the orcs just don’t care about the king at all. But I suspect they will start caring in future versions, so I am right to consider moves in detail. The game maps really nicely onto the 64px layout, and the graphics are quite illustrative (I like the subtle shadows on the players); the audio is good, too, in a simple way. This is a great implementation, and I think it could become something really good with some tweaking.

Blind Bird

A rather fun mouse-only game; the titular “blind bird” keeps walking, bouncing off walls and reversing direction, and you can move one magic block from place to place to help the bird climb obstacles or change direction in the right place. The first few moves give you all the time you want to place the block, but subsequent ones require quite accurate timing, as the bird (an eared dove, apparently) walks off your magic block onto a small safe place and you have to quickly move the block so they can walk onto it again and continue the journey. Because the resolution is so small, the screen camera moves quite a lot, and so I found myself putting the block one space higher or lower than it should be… but that’s my fault, not the game’s fault! Tiny, tiny graphical complaint: the bird’s eye isn’t green, it’s transparent, which means that if it walks in front of some of the tutorial writing, you can see the writing through the bird’s eye. Which looks a bit weird. But that’s seriously the only thing I have to complain about; this is a tiny nugget of joy, this game. I like the four-colour green palette and everything. This is good stuff.

UPCRAWL

Old-skool platformer, with a really high jump. There’s nothing necessarily innovative about this in gameplay, but there doesn’t need to be; it’s fun, and well-implemented. And it does a lot with not many pixels at all. I appreciated the ability to change the music, too. Nice work!

Total Dark

A well-implemented and good-to-play complete game. I like the mechanic of decreasing power when firing bullets; reminiscent of magic spells cast from hit points or stamina. And it’s kept away from being frustrating by having lots of recharge points rather than having them be a battle to even find. Took me some time to complete, and I persevered because I was enjoying myself. A tiny gripe: if the map had a flashing dot showing where I was it would be (I’ve measured this) one hundred billion times more useful. Maybe everyone else just has a better spatial memory than I do? Anyway, great work! One of the things I like most is that although the graphics are very boxy and straight-edged, that really works with the aesthetic rather than looking unfinished or childish like some other games. And the fading light shows that the developer could have done something looking more shaded and real if they’d needed to.

Pixel Beard

Blimey this game does a lot. Lots of primary colours in the graphics, so it feels very retro, not that that’s a bad thing. I got murdered by the barman for spilling all the grog, though :)

onychophora

Named for a velvet worm. This is rather like Snakebird, but with mining. I like the idea. It’s hard to properly understand why one gets buried, though; this is a problem which would, I think, be solveable with better graphics. I think the rule is this: if you’ve dug a hole so that a contiguous block of mud above you is completely separated from a block below you, then that block falls and crushes you. But it’s hard to tell because there’s no animation; digging the final piece of that hole immediately transitions to you being dead. If I could see the block above me fall, then it would be much clearer what was going on, which I think would help a lot. This prototype does suggest that there’s an interesting game here, though, and I’d like to see more of it once it’s completed with animation, maybe some improved graphics, and sound!

Reincarnation - When death calls

Played this, but didn’t get a chance to write a proper review. It made me laugh, though.

Flush Rush

Neat little platformer. The wraparound world takes some getting used to, but it’s a clever innovation. And the frenetic music really adds to the play. Good graphics; a gem, all in all. Nice work!

BEETLE RUSH

A more complex game than it first looks. The premise is simple; identify identical pairs of beetles in the 4x4 grid and drag them together, which causes them to explode, clearing part of the playing field. But this is quite a lot harder than it looks because all the beetles look roughly the same! You have to watch them move fairly closely to tell which ones are actually pairs… and if you pair up two non-identical beetles, they turn into a sort of pupa which blocks up a square on the board. And then once you get the hang of that, right-click drag moves the playfield and you realise that the 4x4 grid you were seeing is actually just a 4x4 section of a much larger grid, which is completely full of beetles, all madly moving and needing pairing up. This is clever stuff; the realisations of each of these things gave me quite a surprise as to how much bigger the game was than I first anticipated. I do have a few small issues to think about, though. Incorrectly pairing two beetles turns them into a sort of red pupa, which is bad. But it doesn’t look bad; I didn’t realise at first that I was doing the wrong thing! Perhaps that pupa could look a little more… incorrect, somehow? Also there are two issues that others have brought up: moving the camera to show a different part of the playfield is way, way too sensitive, and the score at the top of the UI sits on top of the top row of the grid and makes it hard to see. The developer has already acknowledged these, and I’m sure they’ll get fixed. Even despite these, this is a really interesting puzzle game, and fits really nicely into the 64px pixel restriction. Great work!

Full Volley

A full, if simple, game. I didn’t have much of an idea about what good strategy was; I just kinda held down the fire button permanently and moved vaguely around the court, and won 5-1. The graphics has surprising realism; shadows beneath the players, antialiasing and the like; it’s like I’m looking at a video or much higher res imagery, but scaled right, right down (which perhaps is actually the case, depending on what game engine this was built with!) A fun enough diversion, and the developer is not wrong about the 80s hair rock soundtrack :-)

Iceberg 2: Wrath of Don

Little bit of politics :) Actually, this is a game I could completely imagine playing in 1983 or so; escape the enemy, collect the tokens. It’s nicely implemented for what it is, and I like the “Bad Don” frame around it. However, when you (inevitably) run into “Don” (who is very recognisably drawn given the few pixels there are to work with) and get the “we’re doomed” screen, there doesn’t seem to be a way to restart? One has to reset the Pico console. Maybe this is some subtle message (after all, when you’ve destroyed the environment and are doomed, you can’t undo it or start over) but it’s on balance more annoying than it should be :-)

Spider Rider

A complete game, and nicely done. I always know a thing is good when my complaints are about things within the game and not the implementation of it. In particular… man, I hate those solid walls with one gap in them. I run into those all the time. Top score of 335, though, which I’m pretty much OK with after playing a bunch of times. The music’s good (and fits the tone of the game nicely), and the enemies are varied; this would be a launch title if someone put out a 64px gameboy :) One microscopic complaint: the “death” screen which shows your score has the top score value touching the bottom of the screen, and the “score” and “top score” text in a tiny 3x3 font. This makes that screen look less cool than it should; I think that that having the scores one pixel up, and using a slightly larger font, wouldn’t significantly hide the cool background image and would make that screen look so much nicer. That’s honestly the biggest complaint I can come up with, which is a good sign :-)

Jelly Hearts : Gooperts Quest (DEMO)

A fairly basic walk-places-and-attack-things game, but nicely implemented, and the player sprite is quite cute which is cool. Since enemies move around very fast, attacking tends to end up being button-mashing; enter into a room and hammer the space bar to attack until you’ve killed everything. Sometimes a dead enemy drops a heart, which I assume gives health back; one thing missing is that there’s no health bar on screen, which is a bit of a problem because you don’t know how close you are to death. There are also fire squares, and there’s a rather neat effect where touching a fire square not only does damage but turns your sprite a darker colour; increasing amounts of being burned make your player look more and more charred and brown, which is cool. I should also note that the player movement is too smooth; it doesn’t move on the 64x64 grid, but can move in sub-pixel increments. And the music is the same 16 notes over and over; but the developer explicitly calls out that this is a demo and is still under development, and I’m sure all of these things will be fixed with further work!

Conglomecorp

A good concept here, I think. I would agree with other commenters, though; it really suffers from the 64px limitation. I’ve seen the screen essentially be dissolved into what looks like a random collection of pixels and I’ve got no clue what’s going on; this is essentially because the graphics are, I think, at higher resolution inside the game engine and are being rendered and dithered down to fit 64px. A more standard game resolution would likely help a lot with this. I’m also not sure about the overall feel; the ship moves, explicitly, rather slowly (with a “turbo boost” button which speeds it up) and that rather implies that the overall approach is that you pilot slowly, take your time, consider each shot, move gradually and thoughtfully into place, attack from ambush stealth kind of thing. But the first real tutorial is a fast-moving laser space battle between ships, which would much better fit a quick-moving, react-on-instinct, blast-everything twitch style of gameplay. So I don’t know how I’m meant to be playing, which makes me confused. I was also a bit taken aback by having to use a whole bunch of keys to do different things; again, that’s something more suited to a thoughtful slow style of play, which is at odds with the laser battle I’m made to participate in. There’s some good things here (in particular, I think the graphics would look pretty good if they weren’t harmed by being rendered at such a low resolution, and the acceleration audio is evocative and let me know exactly how fast my ship was going), so it will be interesting to see what happens when development continues.

Cybermancer X

Run around and shoot things. The graphics here are very basic, but in a weirdly compelling way I rather like them; it’s stripped back to absolute minimum. As the developer notes, it’s not 64x64, so low rating for that particular thing, but I liked this game rather more than I expected to. As with all games with unlimited firepower, though, there’s no reason to not just hold down the fire button the whole time, which is exactly what I did. I think there are too many controls — left and right are expected, but “fire upwards”, “jump”, “fire”, and “dash” are all separate keys, which is hard to manage in a twitch game like this rather than something more contemplative and thoughtful. There also seem to be some issues with the key handling; sometimes, if you’re firing and running at the same time and then press “jump”, the jump doesn’t register, which is pretty annoying. But this is more fun than I admit I thought it would be at first!

The uke player

Weird concept. The graphics are (deliberately) childishly drawn, and the gameplay isn’t up to much (move around the screen while avoiding obstacles, and that’s it) but it’s given a jaunty, feel-good sort of vibe by the ukulele background music! Not something one would play over and over, but it got a smile and will cheer up people’s days, and there are many, many worse outcomes. A tiny technical complaint; the up and down keys aren’t suppressed by the game, so they also take effect on the embedding web page, which is really annoying; that’s something worth fixing.

Le Chat Fonce: Petite Adventure 2

The Dark Cat goes around collecting coins. This is an old-skool platformer — jump from platform to platform and collect all the tokens until you’ve got enough to win. There aren’t any enemies; your nemesis is missing a jump and falling all the way back down to the ground and then having to climb up again. This is really well implemented, though; the main character is almost featureless but still clear and nicely but simply animated, and the sound design is good. I can completely imagine this being an actual released game in the mid 80s. I think it could be a little bit clearer that a locked door actually is a locked door, though; I found the door to Upper St, and couldn’t get through it, and then later on I somehow had a key and then it opened. I don’t know where I got that key from — presumably I picked it up somewhere? So that was a little confusing. There are also a couple of places where it’s slightly hard to tell whether a platform is a platform or is part of the background. But these are very small complaints! Nice work.

CIA Fish Enthusiast List

Nice work on the graphics. I actually thought, is this really 64x64? And checked, and it is. So you know the developer’s done well there :-) There’s not much to the actual game — walk around, hammer the fish monsters to death — but it’s nicely implemented. The sound is quite good, too; in particular, I realised I was getting cues from it without having to consciously notice them, which is always a sign of good audio design. I’m not quite sure where the CIA fit into this, mind, but perhaps I missed a whole chunk of the game where you put down the axe and invade Cuba or something :-)

The animated GIF screenshots of the game don’t respect the 64px limit, I should note :-) That’s not the game, though, so it doesn’t affect the rating…!

Wildfire

Lovely little Sokoban-style puzzle game, with an interesting frame story. It’s not very difficult (I won third time out), but I think that this could be the basis for a real game with loads of levels, and I’d happily play it. (The first two times I failed, one of them was not realising that one may need the fire to burn away obstructions before killing it, and the second was trying to pick up Mr Bernt himself to take him to the cabin, at which point I discover that… well, that that doesn’t work, and it made me laugh, but I won’t spoil it for people reading this!)

Oh, and I liked the “dollarone” scrolling credit as the game opened. Nice.

The Adventure

Charming little platformer. The player is a very engaging little fellow, and he moves fast and jumps high, both of which are good and contribute to a very flowing feel. He’s pretty vulnerable, though; I died all the time, through accidentally walking into enemies. And although I really liked the hole falling animation and look of surprise the first time around, it’s much less cute on repetition after I’ve died a bunch of times and have to wait through it. Also, having space for jump and X for attack is really rather awkward to control; the up arrow for jump would be considerably easier. There’s a nice vibe about this generally, though; with some polish, this could be a fun little dungeon explorer game.

The mysterious case of Lord Bolton

The beginnings of a good little game here, I think. It does a fair job of providing a slightly creepy atmosphere; the picture of the tentacled guy along with an audio “sting” actually made me jump a little, which was prety cool. However, once I’d found the lever and the key and then opened the gate, the game ended! This may be because it’s really just a proof-of-concept demo for the jam, but I feel like I missed out on something; some explanation, or some conclusion. If this is really just a trailer and will continue to be developed into something larger then I think it’s done its job as a teaser and to prove the tech works ok, though, nice work! One minor complaint: the tables being made of the same texture as the floor makes them ratehr invisible. I couldn’t understand why I was unable to walk further into a room, until I realise that there was a table in the way. This could be solved with shadows, or making the tables be made from a slightly different material than the flooring.

Everyday Struggle

A game about anxiety. I haven’t been in the right frame of mind to play this properly yet and so I won’t rate it because that would be unfair, but it’s courageous of the developer to put this out there, and I applaud that.

Gossamer Girls

Excellently fun game. I took a little while to grasp the exact mechanics — for example, I didn’t realise that bullets were limited for ages, because you start off with a lot, and so I didn’t know what the point of picking up the Xs that dead enemies leave behind was — but that didn’t take long to work out. Good distribution of reward chests and enemies (and a good variety of reward chests too!), and the footsteps being left behind in areas you’ve explored is a really nice touch. A minor complaint: the low “dong” noise you get when you pass through an “empty” square in the between-levels bonus pickups screen makes it sound like you’ve made a mistake in some way. Beyond that (and the enemies looking a bit too basic graphically which is out of place with the rest of the game), I have no complaints at all. Top fun.

A’maze’ing

A simple Bitsy maze game. Sadly, it’s in violation of the 64x64px requirement; it seems to be on a 128x128px grid, which means it’s got twice as much resolution as the jam dictates. Beyond that, it’s a maze game; move around, collect the key, open the door. The maze being on multiple screens is a nice touch; this feels rather like a first game for the developer, and it’s perfectly playable, if basic; finishing a game is important in itself. Hopefully they’ll go on to bigger and better things; a complete game would also have audio, a more detailed title screen, and some measure of extra challenge, and that’s something the developer can work on in future games to make them more accomplished. Good first effort!

Cave-Trapped

What a fun idea! There have been lots of games in this jam which have done well despite the 64px limitation, but this is the only game I’ve seen which thrives upon that limitation and actually puts it to use. The spider’s path being much more complex in a way that the person doesn’t see, because it’s too small for them to notice, is a really clever way to take advantage of the limited size: if you’ve not got much space, zoom it up even further and show all the hidden detail! Very impressed. I also like the graphics; the spider is cute, despite being only six pixels. Evocative. If I have a complaint, I’d say that the difficulty curve is quite high; the first couple of tutorial levels don’t show any complexity but instead just explain the mechanics, which is fine, but then the very next level is rather complicated as we suddenly introduce the idea that the spider’s path is very convoluted. This is not helped by the spider’s physics; it can walk over gaps or fall in an arc as long as it’s moving fast, but I didn’t realise that for ages because when contronted with a puzzling path I move slowly to explore different details. So I kept falling through gaps, and assumed that the goal was to work out how to approach the other side of the gap from a different direction, not that the gap isn’t meant to be a barrier at all as long as you’re walking at speed when you hit it. But these are small issues; the concept here is great, and I like this game a lot.

The Riddlebox

Find the one important object which solves the riddle and bring it back to the starting room. This seems deliberately designed to punish the player; you must bring one object and only one back in order to win, and it needs to be the right one. The actual pictures of the objects are, in most cases, not detailed enough to be able to tell exactly what an object is, so I assume that there’s no way to win other than to repeatedly try each of the objects, fail, die, and start again, over and over. The “learn by dying” game method, in other words. Also, the game seems to be built on a 128x128 resolution rather than 64x64, but since the graphics don’t really need the extra resolution I assume this was an oversight rather than a deliberate attempt to ignore the rules. Anyway, not much of a game, but maybe the next one will solve some of these issues!

Star Raid

Nicely done, with a very retro feel. At first I was annoyed by the slow movement, but after a while I got quite into it; you are a space explorer, after all, and gravity is weird. I got above 200 coins, and the secret rooms were interesting to find. There seems to be some weirdness with jumping onto platforms above and to the side of oneself; my feet don’t reach the platform (although my body does) and I sorta “glitch” onto that platform anyway. This could probably be solved with a tiny little animation, much like the (excellent) one where our little explorer does a three-point “superhero” landing when falling from a height.

---

And, of course, now you’ve looked at all those, you should go and play my game…

Pipe Flip

This jam was good fun. Thank you to Jack Oatley for organising it! And thanks to Alan Pope for playtesting.

One of my major limitations in game writing is that I am supernaturally, volcanically bad at graphics. So something like Lydian, the winning game, is completely beyond me to create, sad to say. This is why I made a puzzle game; the graphics in it are simplistic, to say the least. A few sprites of pipes, and the creeping fluid, and the entry and end screens. One of the advantages of the lowrezjam specifically is that you don’t have to create screens on the fly with code; you can just literally pre-render a bunch of them as PNGs and load those PNGs, because they’re only 64x64 pixels, which is tiny; the title screen, with logo and big PLAY button, is a 1.4KB png file which I just load into place. That’s pretty useful. I also made the game with pure HTML, CSS, and JavaScript; it’s not using a game engine which renders to a <canvas>. All of the things on screen are actually HTML elements. One of the nice advantages this gives is that mobile support is pretty easy, because browsers are already good at that; if I show the thing on screen, the browser handles clicks and so on for me. I can use all the CSS I want, so to scale a thing I don’t need to work out scaling algorithms myself; I just do everything at 64x64, and then apply transform: scale(10) or whatever to the whole containing element to make it bigger. (Pro tip: if you want to do that, and you want it to scale up, pixelated, then apply image-rendering: -moz-crisp-edges; image-rendering: crisp-edges; image-rendering: pixelated; to the thing you’re scaling, and then it’ll scale pixel by pixel, rather than blurring everything. That doesn’t work on fonts, annoyingly, but the rest is fine.)

Another thing I learned was that reviewing other people’s games helps. I grabbed all the results from the jam and put them in a spreadsheet (you can download the CSV file here), and I discovered something. You see, I came 69th overall, which out of 170 isn’t too bad. But I got more reviews on my game than almost anyone; Pipe Flip had 27 reviews and only two games got more than that. I am pretty confident that that happened because I wrote the above set of reviews, and posted them to each game, as the jam was going on. To review a game as part of the jam you have to have entered the jam; what this means is that when you get a review, you know that the reviewer also entered something. And I did my best to write meaningful reviews; not just that a game was good or bad but also what was good or bad about it, suggestions for improvements, applause for things that worked particularly well. I certainly wasn’t the only one doing this, but I think it helped; I not only got a bunch of useful feedback on Pipe Flip but I also had comments back from developers responding to my thoughts on their own games; I think this encouraged them to review mine. Of course, next I need to write a game which people review with higher scores, but that’s for next year :-) And in the meantime, there’s a message here; participate. We’re all in this together; everyone in the jam is looking to hear detail about their own games, whether good or bad, because it makes us all better game developers.

Anyway, that was the LOWREZJAM, 2018. I enjoyed it. Roll on the next one.

Obejct-Oriented Programming the Easy Way gets ever closer, as the first part (of three) is now substantively complete. If you have been holding off from buying the book, now would be a great opportunity to jump in, as a whole part of the book’s argument is now laid out. As ever, your feedback is welcome, and readers who buy now will get free updates throughout the development of the book.

• The power of progressive enhancement – a case study
• The median WordPress page weight is heavier on mobile! – “And it’s about 300 KB heavier than Drupal”
• UX And HTML5: Let’s Help Users Fill In Your Mobile Form by Stephanie Walter
• How Many Sites Are Still Using AppCache? – analysis by @paulcalvano
• Facebook Fueled Anti-Refugee Attacks in Germany, New Research Suggests – “Wherever per-person Facebook use rose to one standard deviation above the national average, attacks on refugees increased by about 50 percent.”
• Alibaba’s strategy for Afrika

• PWA Builder will generate a manifest and a service worker for you.
• [selectors] Solve :visited once and for all – Why web standards take a long time, continued: we have to make sure your privacy is protected.
• Shadow DOM and Custom Elements in Firefox 63 (probably)
• Brotli Compression – How Much Will It Reduce Your Content? by Paul Calvano from Akamai
• Stylable vs. CSS Modules – Rashelle from my old team at Wix compares the two.
• A web of anxiety: accessibility for people with anxiety and panic disorders [Part 1] by David Swallow of Paciello Group
• How Blink works
• Facebook’s failure in Myanmar is the work of a blundering toddler – monetisin’ ethnic cleansing ‘n’ maximisin’ shareholder value.
• Goatse is the golden ratio of the digital age – “On the enduring aesthetics of the grossest image on the entire internet.”

One trick that made me a better programmer/ speaker/ product person: relax. This sounds counter-intuitive in an industry where all-night coding sessions are seen as a virtue, and you’re supposed to have umpty-nine side projects on Github that you do in your spare time. (And we wonder why older people, women with children and people with disabilities are under-represented…)

But for me, resting is when ideas come. The best ideas come in the shower when I’ve not long woken up, or on a Friday evening when I’m drinking wine and listening to music. Your mileage may vary, of course; that’s why I titled this “made me a better programmer”.

When I tweeted this, Phillipp replied

I would go even further and say “rest good!”, because many people are aware of taking a break, but their breaks aren’t resting at all. They still allow to be flooded with information constantly…

This is an excellent point. One of my favourite ways of relaxing is reading. But I’m reading material of my choice, not being waterboarded by the information firehose of Twitter or the web. And if I’m reading, it’s because I want to — I could equally well be listening to music, or writing and recording music.

I advise reading eclectically, about anything that interests you. Even if you’re reading about particle physics, neurology, history or fiction, you’re seeing how other people present information, which can help you be a better presenter. And so many new ideas come from the unexpected collision of different disciplines that that the more widely you read, the more chances you have of seeing parallels and comparisons that others haven’t seen.

For me, relaxing is when ideas come; reading (and talking to a range of people ) is where ideas come from.

Bonus tip: always wear groovy shirts. A groovy shirt makes a groovy mind.

Web Stuff

• What Happens When You Create A Flexbox Flex Container? – Auntie Rachel explains
• Securing Web Sites Made Them Less Accessible – Eric Meyer notes that the drive for HTTPS has made accessing the web harder for people in poor-connectivity places.
• An AI reading list by Hidde de Vries
• EU taking another look at phone chargers because they’re still not standardized – “While much of the market now uses USB C, Apple remains an outlier … it would deprive Cupertino of the royalties it currently collects for its non-standard tech.”

Other stuff

• The Forgotten Stories of Muslims Who Saved Jewish People During the Holocaust
• What if the same force that created civilisation is the thing most likely to destroy it? – a fun solution to the Fermi paradox: advanced life destroys itself.
• The Peculiar Math That Could Underlie the Laws of Nature – second time in a week I’ve read about octonions and their potential usefulness to particle physics. I wish I understood more maths.
• Lidl is launching 5kg boxes of damaged fruit and veg for just £1.50 – bloody good idea in these days of growing poverty and massive food waste
• Bin Laden’s computer: “video of the Rowan Atkinson comedy Mr Bean, episodes of the animated programme Wallace and Gromit, and the viral video “Charlie bit my finger”. There were also more than 30 videos on crocheting.” Unsurprising, really. Being into crocheting is the obvious sign of a ruthless homicidal maniac.

I read Twitter with Tweetdeck. And I use the excellent Better Tweetdeck to improve my Tweetdeck experience. And I had an idea.

You see, emoji, much as they’re the way we communicate now, they’re actually quite hard to read. And Slack does this rather neat thing where if you respond to a message with an emoji, it displays that emoji bigger than normal text so you can see it clearly. And some people just write tweets which are, like, two emoji and that’s it, and it would be really handy if they were large enough to read.

So I thought, here’s an idea; how about, if there’s a tweet which is just emoji, then display those emoji larger so they’re easier to see? Only if there are, say, four or less; you don’t want those people who write a whole huge tweet as emoji to get enlarged. Just the ones where someone responds with two little pictures and that’s it; let’s make that nice and visible, like Slack does.

This is clearly a thing for Better Tweetdeck to do. (They already provide a config option to make emoji a little bigger, which I appreciate.) So… how do we do this?

Well, one obvious way is to do it with JavaScript. Every time we read a new tweet, look to see whether it contains nothing but emoji, and if it does and there are less than four of them, add inline styles to make them larger. Job done.

But… that’s not very efficient, is it? You have to do that every time a new tweet appears, in any column, and that happens a lot. What would actually be better is to write some CSS which does this, and add that CSS one time, when you load up, and then you’re done. Have the browser do the heavy lifting, not us. It is a principle with me that if you can do a thing with CSS, then you should do it with CSS. JavaScript is there for things that CSS can’t do. Don’t use JavaScript, which makes you do the work, when you can use CSS and make the browser do it instead. The browser is better than you at it.

So… what you want to do is this. In pure CSS, if there’s a tweet (which in Tweetdeck is a <p> element) which contains <img class="emoji"> and nothing else, and there are four or fewer of these img.emoji elements, then make those images larger.

In pure CSS. No JavaScript. This is harder than it looks. Go and try to work it out, if you don’t believe me.

Well, the key insight here is that if you are an element, and you are :last-child(X), and you are also last-of-type(X), then there can’t be any elements after you which are not the same as you. So, if an img.emoji is the first of its type, and also the first element, and it’s the third last of its type, and also the third last element, then we know that it is element 1 of three identical elements. So an img:nth-child(1) which is also an img:nth-of-type(1) and which is also an img:nth-last-of-type(3) and also an img:nth-last-child(3) must be the first <img> in a group of three <img> elements. So that solves our problem! All we need is a selector which matches an img which is:

• img 1 in a group of 1 image, or
• img 1 in a group of 2 images, or
• img 2 in a group of 2 images, or
• img 1 in a group of 3 images, or
• img 2 in a group of 3 images, or
• img 3 in a group of 3 images, or
• img 1 in a group of 4 images, or
• …etc

…and that’s pretty easy, although long, to express as a CSS selector. So, to resize all img.emoji elements where (a) there are only img.emoji elements in this tweet and no text, and (b) there are four or fewer img.emoji in the tweet, we need a selector like this:

p > .emoji:nth-child(1):nth-of-type(1):nth-last-child(1):nth-last-of-type(1), /* 1 of 1 */
p > .emoji:nth-child(1):nth-of-type(1):nth-last-child(2):nth-last-of-type(2), /* 1 of 2 */
p > .emoji:nth-child(2):nth-of-type(2):nth-last-child(1):nth-last-of-type(1), /* 2 of 2 */
p > .emoji:nth-child(1):nth-of-type(1):nth-last-child(3):nth-last-of-type(3), /* 1 of 3 */
p > .emoji:nth-child(2):nth-of-type(2):nth-last-child(2):nth-last-of-type(2), /* 2 of 3 */
p > .emoji:nth-child(3):nth-of-type(3):nth-last-child(1):nth-last-of-type(1), /* 3 of 3 */
p > .emoji:nth-child(1):nth-of-type(1):nth-last-child(4):nth-last-of-type(4), /* 1 of 4 */
p > .emoji:nth-child(2):nth-of-type(2):nth-last-child(3):nth-last-of-type(3), /* 2 of 4 */
p > .emoji:nth-child(3):nth-of-type(3):nth-last-child(2):nth-last-of-type(2), /* 3 of 4 */
p > .emoji:nth-child(4):nth-of-type(4):nth-last-child(1):nth-last-of-type(1) {/* 4 of 4 */
    styles here
}

It looks long and cryptic and mystic, but actually it’s not that complicated at all. And, importantly, this is all the work you have to do. Add that CSS, and then any new tweets that come along which match our criteria get automatically styled to match. You don’t have to inspect every tweet and tweak it. The browser does the work, which is what the browser is designed for. If you can do a thing with CSS, then do it with CSS. Job done.

I’m quite proud of this. There’s an increasing, and depressing, movement to add more JavaScript to web pages, to write more code client side, to deal with huge JS downloads by improving compression rather than by just doing less JavaScript. I, myself, I’m in favour of having CSS do the things it can do, even if you have to be creative to solve that problem. Falling back to JavaScript to do styling is a failure. Use CSS where you can; being clever in how you do that CSS is part of the fun. You don’t need JS for this, really you don’t. CSS actually is awesome.

My pull request at Better Tweetdeck is, at time of writing, still pending. Proof that this technique works is in jsbin. Fingers crossed my PR gets accepted, and we can solve another problem with pure CSS.

Purity is great. And if you’re thinking, CSS can’t solve real problems… check out Bence Szabó‘s amazing pure CSS stacking game. I was open mouthed with awe. If you aren’t, maybe you should spend some time going back over how the web works, and then you will be too.

I was saddened to read the alt-right describing Facebook and YouTube’s removal of Infowars as “simultaneously purg[ing] him from the internet“:

Whether you hate Alex Jones is beside the point. Do you love the fact a handful of tech monopolists have the power to simultaneously purge him from the internet?

— Michael Tracey (@mtracey) August 6, 2018

I assume Mr Tracey has not heard of the World Wide Web, which Tim Berners-Lee invited the public to try 27 years ago yesterday:

On 6 August 1991 @timberners_lee first invited the public to participate in the world wide web. "The WWW project merges the techniques of information retrieval and hypertext to make an easy but powerful global information system.” He added: "Try it”https://t.co/aPFOnXDbbC pic.twitter.com/YphZXzUfw1

— W3C (@w3c) August 6, 2018

(Alternatively, perhaps Mr. Tracey has heard of it, and is simply distorting the facts to mislead people – surely not?)

Anyway, this new-fangled “World Wide Web” allows anybody to make what we in the trade call “a website”.

Mr Jones’ Infowars site already has one, which hasn’t been “purged” by anyone. (I won’t link to it because, well, ewwwww. Don’t “wah wah censorship” at me; my website, my rules.) But, as a service to alt-right frothers everywhere, here’s how you can set up your own.

You could go to wordpress.com where, for as little as £3 a month, you can host your site with a custom domain name (so www.horriblebullshit.com instead of horriblebullshit.wordpress.com). Alt-right people will need to exercise a little verbal continence to comply with their user guidelines:

The following activity/material isn’t allowed on WordPress.com … Illegal content and conduct.
… you cannot post a genuine call for violence—or death—against an individual person, or groups of persons … Don’t share someone’s personal information without their consent.

Note that these pretty laissez-faire terms of service do not curtail your free speech; WordPress.com is a business and isn’t obliged to take your money. The American first amendment applies only to the government.

As an alternative to WordPress.com, Wix allows you to make your own pretty website with a drag and drop builder, and host it with them for a small amount of money. Again, a modicum of decency is required; you can’t publish stuff

which may be deemed as defamatory, libelous, obscene, harassing, threatening, incendiary, abusive, racist, offensive, deceptive or fraudulent, encouraging criminal or harmful conduct.

Squarespace and Weebly also allow you to build and host websites (although I haven’t tried them. I used to work for Wix).

Tumblr will host your content and videos, with community guidelines:

Don’t encourage violence or hatred. Don’t make violent threats or statements that incite violence, including threatening or promoting terrorism. Especially don’t do so on the basis of things like race, ethnic origin, religion, disability, gender, gender identity, age, veteran status, or sexual orientation.

I think such rules on a website that somebody else owns are entirely legitimate. As clause 19 of Terms of Service on Alex Jones’ Infowars website says

If you violate these rules, your posts and/or user name will be deleted.

Remember: you are a guest here. It is not censorship if you violate the rules and your post is deleted. All civilizations have rules and if you violate them you can expect to be ostracized from the tribe.

If you don’t want to trust a third party with your data, good on you! I’m all for an web of independent authors. (Or perhaps you can’t even muster up the good manners to be hosted by one of these services, in which case, bad on you. Have a good hard look at yourself in the mirror.)

It’s very easy these days to register a domain name (Google it), set up the free, open-source blogging WordPress software, choose any of thousands of free themes, and publish to your heart’s content, especially if you choose a host that specialises in WordPress hosting. You might have to pay slightly more, and do a little bit more work to make sure all software is updated and secure — but that’s a price I’m willing to pay in order to own and control my own content.

So there you are, alt-right folks. I’m an atheist liberal, so I despise the divisive nonsense you excrete. But I love that the Web allows everyone to publish, and wouldn’t want you to feel left out because you’re misinformed by people like Michael Tracey who don’t understand the web.

Of course, it’s perfectly possible no-one will visit your website to read how Bin Laden faked the moon landings in order to draw attention from the fact that Marilyn Monroe was a CIA-funded muslim who invented income tax and fluoridated water in order to seize your guns and pollute your precious bodily fluids. But that’s freedom.

Happy hating!

Yesterday, I got blocked on Facebook for asking “bioresonance practitioner” Life Principles for more information about their “Quantum Medicine”, as I’m too unversed in science to understand it from their explanation about homeopathy, and Dr Raymond Rife’s “electronic machine” that cured 14 of 14 peoples’ cancer before it was suppressed by “Big Pharma”.

To be clear, they’re not advertising treatments for cancer (that would be illegal). They’re selling “treatments” for addiction that use “Quantum Medicine”. This is from their QM “explainer”:

In 1981 Dr Raymond Rife came up with his electronic machine which would shake pathogen to death. He took 14 people who were sent home to die from end stage cancer and with a three minute treatment twice a week cured 12 of them. The last two were cured after another four weeks of treatments. This was certified by 12 eminent oncologists at the time.

The claim that ‘In 1981 Dr Raymond Rife came up with his electronic machine” is tricky to substantiate, as Rife died on August 5, 1971. OR DID HE?!? Maybe his machine made him immortal. Perhaps his quantum kundalini is metastatising with the cosmos, as we speak.

Also what is homeopathy if not energy medicine? According to Avogadro’s law of dilution the chances of the original molecules after years of dilution is nill but the remedies are even more potent. The imprint on the water is what counts and not the original substance they started off with, well that’s quantum medicine.

Certainly, Avogadro shows that “the chances of the original molecules after years of dilution is nill [sic]“. But he certainly did not go on to say “the remedies are even more potent”; that’s Samuel Hahnemann, the man behind homeopathy. The “imprint on the water” (“water memory“) is not accepted by scientists, and quite what that has to do with quantum mechanics is unclear.

So does it matter if the medicine is in a physical form or in quantum form applied to the body energetically or informationally? If the result is the same then they are effectively medicines.

Er – what?

This was vomited out for me as a Facebook ad (presumably because Life Principles is based in Birmingham, as I am). Facebook shouldn’t profit from such nonsense, especially as previous complaints about Life Principles’ dodgy advertising were upheld by the Advertising Standards Authority:

We told Life Principles Ltd to ensure that future ads did not make efficacy claims that implied guaranteed success for their treatments unless they held robust evidence to substantiate the claims. We also told Life Principles to ensure that their advertising did not offer treatment or discourage essential treatment for conditions for which medical supervision should be sought.

Life Principles describes “Modern medicine” as

a business model that makes tons of money for the Big Pharma who blatantly hide bad research and only publish favourable results.

Their Facebook “About” page promotes awards for people promoting them:

10% Referral fee after someone has successfully stayed quit for 12 months. If you promote our business as a business distributing our leaflets we will give you 20% of our takings. So for heroin addiction you could earn a cool £400.

A “cool” £400. Classy.

As someone with Multiple Sclerosis, I get my fair share of quacks popping up to sell me bee-string therapy or warn me against coffee or aspartame.

I’d sooner trust “Big Pharma” than “Big Snakeoil”, thank you.

A weekly(-ish) dump of links to interesting things I’ve read and shared on Twitter. This is the last one to be sponsored by those nice folks at Wix Engineering, ’cause I’m leaving Wix.

• <picture> element pants! – the actual underwear I wore on 8 Dec 2011, when I first blogged about my idea for responsive images, are on eBay. A must-have unique collectors item for HTML fans everywhere, and an heirloom to be passed to future generations. – auction ended!
• CSS Properties Index – continuously updated list with link to relevant spec and initial values
• Free Music Archive – various CC licenses, loads of genres
• Somebody at Fitbit needs a lesson on the menstrual cycle – “Periods should be between one and 10 days” according to Fitbit. How many women were on that tech team?
• Adobe Flash’s Gaming Legacy — Thousands upon Thousands of Titles — and My Efforts To Save It – wow, someone else gives a shit about preserving web’s flash heritage. (My piece last year.)
• Related: What Do You Need To Know When Converting A Flash Game Into HTML5
• Phone and internet use: Number of mobile calls drops for first time – 78% of UK adults own a smartphone; when awake we check phone every 12 mins; 75% say voice calling is important, 92% say web browsing is crucial. Calls are cheaper than ever, volume of calls dropped 1.7% in 2017. For the first time, women spent more time online than men, particularly in the age group 18 to 34 where females spent an average half an hour longer online than men.
• A Spectre is Haunting Unicode – The ghost characters of Japanese JIS X 0208 encoding
• Objects of Intense Feeling: The Case of the Twitter API – “An API is never a neutral tool. Rather, an API is the result of complex sociomaterial negotiations and practices that embodies specific values.”
• The Doves Type – a bitter feud between business partners saw the metal originals secretly thrown into The Thames between 1913-17. They’ve been salvaged by divers and the typeface re-created digitally.
• The Bullshit Web – “Bullshit — in the form of CPU-sucking surveillance, unnecessarily-interruptive elements, and behaviours that nobody responsible for a website would themselves find appealing as a visitor — is unwelcome and intolerable. Death to the bullshit web.”

There’s a great song on Michelle Shocked’s first album called The Secret to A Long Life is Knowing When It’s Time To Go.

And I’ve followed Ms Shocked’s advice through much of my career, sometimes out of self-preservation, but mostly because I like starting things up and then passing on the baton before I become the crusty old-timer in the corner saying “We don’t do it like that here”. That’s why I left Amnuay Silpa school in Bangkok four years after we set it up, once we became profitable; likewise, I left the Solicitors Regulation Authority after we established a new, standards-based website, a sane editorial policy and I recruited and trained my successors.

And now, after 15 months, I’m finishing my consultancy at Wix Engineering. They bought me in to help them with a project they’d been working on. We radically simplified it, then made sure that Stylable (as called it) adhered to the rules and spirit of CSS. Then it was time to tell people about it, firstly through a music video, then through conference talks.

That’s done; as one of the Product Managers at Wix R&D, Arnon Kehat, said

I was part of the team that hired Bruce to help us make our open source contribution stand-out, and reach the right people. I cannot imagine how we would have done it without him… He guided us where we hadn’t a clue, and helped us make some really complex discussions into fun ones. He helped us understand our audience better, and to make sure we approach them the right way.

And I’m happy to say that the first components made with Stylable are now running in production, available for the 120 million Wix users to add to their sites.

In some ways, Wix was like working for Opera – both had very strong consumer brands, and fiercely loyal users, but weren’t well known as places of engineering excellence. At Opera, I worked to show web developers how our engineers made a browser run on low-specced devices, to serve its millions of customers in the developing world. At Wix, I reported directly to Nadav, one of the founders – but he doesn’t wander around in a shiny suit of synergies, smoking caviar; he writes JavaScript all day in the Stylable team. It’s a very engineering-led company; over 50% of the workforce are engineers.

I’m not too proud to admit that when I was at Opera I had a somewhat naive view of how websites get made in ‘industry’. Working with a company that has so many people making sites on the Wix platform has taught me a great deal about building the web at scale, about kind of infrastructure behind the scenes, performance and where the rubber meets the road in terms of standards.

It was great fun to work with the Stylable team who are lovely people and brilliant coders who really, really care about the Web, and with groovy cats in wider-Wix such as Dan Shappir, Danielle Kanish, Maya Alon, Mor Gilad, Morad Stern, and Sergey Bolshchikov. Kisses to all of them.

Next: off to Asia for a while to meditate and make music before the next career adventure.

The BBC has a report on Some of the funniest out-of-office replies. It’s a summertime filler story but I noticed them quoting Tyler Brûlé who wrote an article suggesting that people who set out-of-office messages simply aren’t committed enough. This is another example of “presenteeism”, one of the reasons that British workers don’t take time off sick when they’re ill.

I love my holidays; I work to live, not live to work, although I do love what I do. So I always set an Out of Office message on my employer’s corporate email. I’ve noticed through various jobs that most of the email I receive is either ephemera (“I’ll be late today”/ “Please note the fridge will be emptied on Thursday”) or conversations that go on for a few days, and then resolve themselves.

So my out of office says “I’m out until DD/MM/YYYY. If your message remains important when I return, please re-send it then, as I will delete all messages received before that date without reading”. And, apart from messages from direct bosses, I do just that.

Feel free to use my personal email out-of-office as inspiration:

OFF THE GRID!

I love you. I really do. The way your cute nose goes all crinkly when you smile – I dream about it and sigh. The way you toss your beautiful hair when you’re materialising from hyperspace makes my heart go pit-a-pat and skip a beat. Thinking of how your tentacles encircle my exoskeleton causes … well, let’s not go there.

But that doesn’t change the fact that I’m backpacking around India at the moment, and connectivity is limited. And there’s loads of stuff to look at that’s cooler than email, so it may take time until I reply. Until we see each other again, I yearn for your gentle caress and to hear the ethereal howling you make when extruding your egg sacs.

CUDDLES. xxx

Relax! Read a book! Go swimming! Play guitar! Get drunk! Learn karate! Do some yoga! Play tennis! Make love! Have fun with your friends and family! Remember, the graveyard is full of indispensable people.

LOL, the far right. They’re spreading a photo of a £5 on which someone’s drawn a speech bubble to show Winston Churchill saying “Free Tommy Robinson”. Churchill would never have approved of Mr “Robinson” Yaxley-Lennon’s contempt of court, jeopardising a free and fair trial. I made and sent them this to show them what Churchill said on July 20, 1910 in the House of Commons:

The mood and temper of the public in regard to the treatment of crime and criminals is one of the most unfailing tests of the civilisation of any country. A calm dispassionate recognition of the rights of the accused … These are the symbols, which, in the treatment of crime and criminal, mark and measure the stored-up strength of a nation, and are sign and proof of the living virtue in it.

It’s almost as if they have no real knowledge of, or respect for, British traditions such as rule of law, religious tolerance, freedom of speech etc, and mendaciously hijack national symbols (Union Jack flag, Churchill) in order to apply a veneer of “patriotism” over what’s simply racism.

A weekly(-ish) dump of links to interesting things I’ve read and shared on Twitter. Sponsored by those nice folks at Wix Engineering who push banknotes under the elastic of my underpants in order that I carry on reading stuff.

• Non-disabled web users also benefit from sites that implement WCAG accessibility guidelines – irony klaxon: it’s a PDF.
• Why are web standards so slow? – self-link
• How to design accessible games by BBC
• Fractional – Ethan Marcotte on the the usefulness of the fr unit, and how CSS Grid is changing the way we do responsive design
• Stuff you can do with CSS pointer events – “Change styling of a parent on hover”, “Style the text of the sibling card when the button is hovered” etc.
• W3C Web Payments Working Group progress report
• Clippy – a nice graphical CSS clip path generator
• Parker “is a stylesheet analysis tool. It runs metrics on your stylesheets and will report on their complexity” by Katie Fenn
• Logging Activity With The Web Beacon API by Drew McLellan
• CSS Animations – a very pretty free online course from HTML Academy
• Speed is now a landing page factor for Google Search and Ads – so Google’s rewarding performant, responsive, secure sites. Good.
• Art of debugging with Chrome DevTools
• Vote Leave’s targeted Brexit ads released by Facebook -“Early on in the campaign, Vote Leave launched a giant data harvesting exercise through a competition to win £50m if you could correctly guess the result of all 51 games in the 2016 European football championship.”
• Talking of fraud: Guardian US Finds 72% Of Video Spend Is Fraudulent Without Ads.txt
• How tech’s richest plan to save themselves after the apocalypse – “But the more devastating impacts of pedal-to-the-metal digital capitalism fall on the environment and global poor … This “out of sight, out of mind” externalization of poverty and poison doesn’t go away just because we’ve covered our eyes with VR goggles and immersed ourselves in an alternate reality.”

Why are standards so slow? Find out in this intricate discussion of subgrid BPMs (border/padding/margin) & the TSA (track sizing algorithm) of its parent grid in a subgridded axis.

What’s that all about? I have no idea. I suspect very few people have. But if the CSS Working Group get it wrong, it’ll be on the web —and pissing off web developers— for ever.

Also, have we defined what happens when an RTL Flexbox is inside a CSS Grid, that an ancient CMS has put in a float that’s in a display: table-header container? No-one will ever be mad enough to do that, you say? But, yes, they will, so behaviours need to be defined so browsers are interoperable.

And all of this conversation has to be done asynchronously over GitHub or mailing lists so that all interested parties can contribute, across timezones, to fit the schedules of people across the world, some of whom do Standards full-time, some of whom do it as a part of their jobs, and some of whom do it afterhours.

And that’s why web standards are so slow, and so powerful — they’re made in the open, for everybody.

Addendum, 27 July 2018:

I didn’t want this to suggest that because standards are necessarily slower than company X magicking up some Proprietary FlimFlam™, therefore progress on the web platform must be slow. Many standards are retrospective: an encouraging example is document.querySelector, which saw the usefulness and community adoption of jQuery, and therefore baked the idea of using CSS selectors in JavaScript into browsers.

Standards such as Houdini are explicitly designed to open up the black box of browsers’ super-optimised CSS flux capacitors so developers can polyfill upcoming/ putative CSS features without having to replicate the whole system in order to tweak part of it. If you haven’t read up on Houdini, a good starting point is Houdini: Maybe The Most Exciting Development In CSS You’ve Never Heard Of. For the philosophical background, read The Extensible Web Manifesto.

With the excellent browser interoperability that HTML5 ushered in, the unlamented death of vendor prefixes and plugins, and the near-ubiquity of evergreen browsers, the future of web development is so bright I gotta wear shades.

In my previous post, I mused on the value of Freedom Zero and of a non-free licence that allows for study but not for use:

I think it would have to be a licence that enabled studying, sharing and modification of the software, but that explicitly forbade any use for any purpose that isn’t studying, modifying or sharing. With a “contact me or my agent, tell us what you’re doing, and we’ll decide whether to grant you an additional licence for use” suffix. This is more open than closed proprietary software, but no more available for deployment to bad actors.

Waking up this morning I remembered that I have a copy of Numerical Recipes. This is a book, that contains code, and as such you can read the code. But not much else:

Without an additional license to use the contained software, this book is intended as a text and reference book, for reading and study purposes only. However, a restricted, limited free license for use of the software by the individual owner of a copy of this book who personally keyboards one or more routines into a single computer is granted under terms described on p.xix.

Page xix expands:

If you personally keyboard no more than 10 routines from this book into your computer, then we authorize you (and only you) to use those routines (and only those routines) on that single computer.

If you want to study, or to try things, knock yourself out. If you want to distribute things, or use things, get in touch and we’ll choose whether to sell you a licence.

This is not unexplored territory.

I’ve been thinking lately that if we don’t want to work on the databases that extremist governments use to detain immigrants they have separated from their children, or on the operating systems that well-equipped militaries used to rain autonomous death from above, or the image processing tools used by mass surveillance networks, then we need to stop dishing out the freedom to run the program as you wish, for any purpose.

That also means discriminating against fields of endeavour, so such software would not only not be Free Software but not even Open Source. I’m OK with that, if it also means that it’s not used for purposes I don’t want to support. I still think Free Software is better than closed proprietary software, but have come to believe that Free Software is the amoral option where what our field needs is morality.

I don’t know what this would look like. I do not believe it would look like The JSON Licence, which is open to misinterpretation (intentional or otherwise). I think it would have to be a licence that enabled studying, sharing and modification of the software, but that explicitly forbade any use for any purpose that isn’t studying, modifying or sharing. With a “contact me or my agent, tell us what you’re doing, and we’ll decide whether to grant you an additional licence for use” suffix. This is more open than closed proprietary software, but no more available for deployment to bad actors.

Yes, that can be abused, but that doesn’t mean it’s not worth trying.

Recently the question of whether browsers should have a View Source function has reared its head again. Chris Coyier says no, as do Tom Dale and Christian Heilmann. Jonathan Snook says yes they should.

The argument against essentially boils down to this: the browser devtools are better. This is undeniably, absolutely the truth. You can not just see the original HTML source of a page but manipulate it, drill down into it, see it beside the page itself and see which parts correspond. Everyone who develops for the web spends most of their day in the devtools, and rightly so. They are enormously powerful. View Source… isn’t. It’s a throwback, a historical legacy back from the days when you couldn’t introspect a page, couldn’t fiddle with things at runtime. If something was wrong with the page you were building, you went back to your editor and tentatively changed a thing, and then went back again to the browser and hit Refresh to see if you’d fixed it. Debugging blind, like finding your way through a cave with no lights on. You were quite likely to be eaten by a grue. Things are better now.

There are minor reasons why View Source is a good idea. One of them is that it’s an easy way to see the source you were actually given, before the in-page JavaScript started screwing around with it. I don’t use this a lot, but I do use it. It’s one of those small but handy features; a little big detail.

Another is: there are twenty years of simple documentation saying “you can see what this web page does just by hitting View Source”.

Yet another is that the devtools are pretty confusing if all you want to do is look at the source of a page. This is (I think) similar to Jon Snook’s arguments, linked above: “The sites some build may be simple static sites, befitting of a simple View Source … Just because you don’t need those tools doesn’t mean that somebody doesn’t need those tools.”

The major reason to keep View Source around is… well, time for a little story.

Google have a search app, on Android phones. The Google search bar at the top of the Android home screen (the one you can’t get rid of evn if you want to, without extreme measures) shows query results in a thing which is almost but not quite a web browser. The results look like the normal Google search results you’re used to from searching in the browser, but it’s actually a separate app. And that’s fine; you can see the results, and tap them, and a result opens in a browser, and everything’s good. I found this pretty useful, until the first time I did an image search and then long-pressed one of the images to open it on its own. And… I didn’t get the popup menu. Because this thing isn’t really a browser. It’s a browser but with all the bits that let you look under the surface turned off, because you don’t need them.

I do not like that attitude. I like that the web is made up of separate bits that you can see if you want to. You can understand how it works by piecing together the parts. It’s not meant to be a sealed unit, an appliance which does what the owner wants it to and restricts everything else. That’s what apps do. The web’s better than that. Like stories our parents told about how they could fix their cars when they were younger but now you can’t without training and magic screwdrivers and the secret config software. It’s a switch between being able to see the bits of the jigsaw if you want to, and being able to see the bits of the jigsaw only if you’re allowed to.

In Neal Stephenson’s Anathem, there’s a discussion between Raz, an avout (basically a monk cloistered away in a monastery, but a monk of science rather than religion), Cord (his sister, an experienced engineer but a normal person, not an avout), and Yul (her boyfriend, and something of a handyman but without formal training). Raz tries to explain that a stove which is a sealed unit appliance and which works perfectly would be better than an unreliable stove deliberately kept simple so people can understand it; Cord and Yul try to explain that a stove which they can understand is better, even if unreliable, because a mysterious black box which does what you want today might mysteriously stop doing what you want tomorrow and you’ll have no idea why.

‘I guess because I live in a place with almost zero praxis [technology], it never occurs to me to think about such things,’ I [Raz] said. ‘But at times like this, the absurdity hits me between the eyes. There’s no reason to put up with junk like this. A stove with dangerous, unreliable chemical fuel. With orifices that clog. In four thousand years we could have made a better stove.’

‘Would I be able to take that stove apart and fix it?’

‘You wouldn’t have to, because it would never break.’

‘But I want to know if I could understand such a stove.’

‘All right, I take your point. You’re really asking if the average person could understand the workings of such a thing—…’

‘I don’t know what an average person is. But look at Yul here. He built his stove himself. Didn’t you, Yul? And it worked,’ Cord said.

‘Took me two years to make it run right,’ Yul admitted.

‘And none of that would have been possible with some kind of technology that only an avout can understand,’ Cord concluded.

‘Okay, okay,’ I said, and let it drop there. Letting the argument play out would have been a waste of breath. We, the [avout], had the power to change the physical world through praxis. Up to a point, ordinary people liked the changes we made. But the more clever the praxis became, the less people understood it and the more dependent they became on us—-and they didn’t like that at all.

Extract edited a little for length, but without removing the sense of it

Nobody actually wins this argument. These are two genuinely differing points of view, I think; there’s no obvious knockdown answer, no obviously correct approach to take. To be an avout or to be a Muggle is kinda a choice.

There will be some people reading this saying: this is a very handwavy rarefied argument. Removing ‘View Source’ is another small move in the direction of taking away the web’s democratic nature? It’s one more example of the boot of the Them in crushing out our ability to know what’s going on? Get over yourself, Langridge. Stop making philosophical arguments and let’s be practical and realistic.

This is a fair comment. My response to it would, then, be: what harm is keeping the menu item around actually doing? It’s one menu item. It’s taking up very little space in the UI, it’s not anywhere particularly obvious, and even if you don’t think my arguments above or Jon Snook’s arguments are winning ones, we might be a little bit right, and so why not just keep the menu item? It’s no extra work to code it; the code already exists.

Ah, you may say, but we shouldn’t have menu items that we don’t need. If it can be cut out, cut it out. Don’t have more options, more preferences than you need. And this is also correct; it’s a good principle of UX design. I’ve been quoting Havoc Pennington’s essay on preferences for 16 years now and I’m not likely to stop. It is completely true that extra options and extra preferences have a cost.

It’s not that that’s a bad argument, because it isn’t. It’s that that argument is just as theoretical and rarefied and philosophical as is my argument that taking away another tool of understanding is a bad precedent.

So, is it best to be an avout or a Muggle? Either are, I think, fine. But I don’t like it when the avout try to take away Muggle tools, and I don’t like it when the Muggles try to limit how creative the avout can be. If someone, not a web developer, complained that the devtools were incredibly complicated, I’d mostly be OK with the argument that those tools aren’t for that person to look at, and the complexity is aimed at the actual users of the devtools. It seems right to do them the same courtesy. So perhaps View Source is a Muggle tool and we avout shouldn’t use it, but that doesn’t mean we should take it away.

A weekly (-ish) dump of links to interesting things I’ve read and shared on Twitter. Sponsored by those nice folks at Wix Engineering who hurl money at me to read stuff.

• Chuckle o’the week: CSS: A New Kind Of JavaScript by Heydon Pickering
• T-25 days until Chrome starts flagging HTTP sites as “Not Secure” – check your domain here
• Antitrust: Commission fines Google €4.34 billion – “for illegal practices regarding Android mobile devices to strengthen dominance of Google’s search engine”
• Why GOV.UK content should be published in HTML and not PDF (all content, really!)
• Guppy – A friendly application manager and task runner for React.js – “a friendly GUI for many of the typical tasks facing React developers … we’ll always prioritize the new-developer experience”. Pre-alpha, MacOS only.
• We have DevTools. What about DesignTools? asks Razvan Caliman, in his CSSconf EU 2018 talk.
• 9 Biggest Mistakes with CSS Grid – video by Jen Simmons (14 mins)
• React Component Patterns and Defining Component APIs in React
• W3C Workshop on Web5G:
  Aligning evolutions of network and Web technologies – “how the Open Web Platform could help drive the adoption of 5G innovations from the applications layer to the network level.”
• How the Blog Broke the Web – an article that Peter Gasston rightly characterises as ‘I preferred the web when it was just me and a few thousand middle-class Westerners like me.’

Story points as described represent an attempt to abstract estimation away from “amount of stuff done per unit time”, because we’re bad at doing that and people were traditionally using that to make us look bad. So we introduce an intermediate value, flip a ratio, and get the story point: the [meaningless value] per amount of stuff. Then we also get the velocity, which is the [meaningless value] per unit time, and…

…and we’re back where we started. Except we’re not, we’re slower than we were before, because it used to be that people asked “how much do you think you can get done over the next couple of weeks”, and we’d tell them, and we’d be wrong. But now they ask “how big is this stuff”, then they ask “how much capacity for stuff is there over the next couple of weeks”, and we tell them both of those things, and we get both wrong, so we still have a wrong answer to the original question but answered two distinct questions incorrectly to get there.

There’s no real way out of that. The idea that velocity will converge over time is flawed, both because the team, the context, and the problem are all changing at once, and because the problem with estimation is not that we’re Gaussian bad at it, but that we’re optimistic bad at it. Consistently, monotonically, “oh I think this will just mean editing some config, call it a one-pointer”-ingly, we fail to see complexity way more than we fail to see simplicity. The idea that even if velocity did converge over time, we would then have reliable tools for planning and estimation is flawed, because what people want is not convergence but growth.

Give people 40 points per sprint for 20 sprints and you’ll be asked not how you became so great at estimation, but why your people aren’t getting any better. Give them about 40 points per sprint for 20 sprints, and they’ll applaud the 44s and frown at the 36s.

The assumption that goes into agile, lean, kanban, lean startup, and similar ideas is that you’re already doing well enough that you only need to worry about local optima, so you may as well take out a load of planning overhead and chase those optima without working out your three-sprint rolling average local optimisation rate.

A weekly (mostly) dump of links to interesting things I’ve read and shared on Twitter. Sponsored by those nice folks at Wix Engineering who hurl money at me to read stuff.

• Reminder! Chrome will mark all HTTP sites as “not secure” – “Beginning in July 2018 with the release of Chrome 68”
• Three.js in CSS via the magic of Houdini, by Ada Rose Cannon…
• …The CSS Paint API – and Ruth John explains the magic
• How to build complicated grids using CSS grid
• Firefox and the 4-year battle to have Google to treat it as a first-class citizen – “Web monoculture is well and truly alive when Google cannot be bothered to make a full-featured cross-browser mobile search page.”
• A High Level Post Mortem of the eslint-scope Security Incident – ah, the joys of dependancies.
• How a Microsoft font brought down Pakistani Prime Minister Nawaz Sharif – “wags on Twitter were saying that Pakistan was now “Sans Sharif”.”

It’s still very much a work in progress, but OOP the Easy Way is now available to purchase from Leanpub (a free sample is also available from the book’s Leanpub page). Following the theme of my conference talks and blog posts over the last few years, OOP the Easy Way starts with an Antithesis, examining the accidental complexity that has been accumulating under the banner of Object-Oriented Programming for nearly four decades. This will be followed by a Thesis, constructing a model of software objects from the essential core, then a Synthesis, investigating problems that remain unsolved and directions that remain unexplored.

At this early stage, your feedback on the book is very much welcome and will help yourself and fellow readers to get more from the book. You will automatically get updates for free as they are published through Leanpub.

I hope you enjoy OOP the Easy Way!