Donnerstag, 6. Juni 2019

UIKonf 2019

A mere two weeks after my last conference I find myself at yet another one. One I have not been to before and also with a different focus than my usual ones. UIKonf in the history-charged German capital Berlin. UIKonf is an iOS-only conference, so this is new territory for me in terms of technology (Swift, Apple ecosystem) and also mindset (mobile, Apple ecosystem ;-)). 

So you might wonder “Why?” especially since I am more of an Android guy. The reason why I decided to visit a mobile conference is that a few months ago I transferred to a different team inside my department at “Süddeutsche Zeitung” which is responsible for building the SZ News Apps for iOS and Android. So I am now officially an app developer, even though I do not have much of a clue yet (shush… don’t tell my boss).

The reason why I chose this particular conference was that it was among those recommended to me by my new colleagues. UIKonf was recommended to me by my lovely colleague and iOS expert Lisa Berle as one with a good reputation in the iOS community. Even though she has not been there yet herself she decided to tag along meaning that I would not be alone among the Apple disciples ;-)

The conference features quite a range of side events. While Monday and Tuesday are the main conference days where all the talks are taking place there are additional workshops on Saturday and Wednesday (some are free, some require extra payment). Also happening on Wednesday is the unconference with lab coding sessions and more. Sunday has a variety of socialising events in the early afternoon ranging from a bike tour over a boat ride to museum visits and the kick-off party in the evening where it is also possible to register for the conference days.

For time and budget reasons we decided to skip both workshop days and only attend Sunday to Tuesday. Lisa chose the 3.5 hrs walking tour while my lazy self settled for a boat ride on the Spree. The boat tour took us up and down the river past different government buildings and other sights like the museum island for a good 1.5 hrs. As there was still quite some time left until the kick-off party I decided to visit the Brandenburg Gate and Alexanderplatz on my own.




 


The kick-off party took place in the wonderful beergarden of James June where we met up with three nice chaps from Dresden who Lisa met at the walking tour. We enjoyed our evening with good food and a few drinks.





Day 1

Before moving on to the talk themselves I wanna give a short overview over all the big and little things I noticed in the run-up. 

The first and foremost fact to mention is the speaker lineup. The organizers decided to have an all female speaker list for this year. I am aware that this is a polarizing topic but I appreciate the effort made by the organization as to make a statement and hopefully incent more women to speak at other conferences. Important fact here: The conference was fully booked and it seemed to me that there was a higher percentage of women than at other conferences (though it could be that all iOS conferences are like this).

What struck me as a bit odd was that even though some speakers had been posted on the website for quite a while the topics of the talks had not been published until shortly before the conference and there were no abstracts at all. So buying the ticket was very much like the proverbial pig in the poke.

Two screens on both sides of the stage showing the text “Live transcription” reminded me about btconf two weeks before where all talks received a live transcriptions as well. At btconf the service was provided by White Coat Captioning. I asked in a tweet if it could be Andrew doing the captioning again and got a very quick reply that it was indeed the same company but a colleague of Andrew as he was already booked for another event. Funny how an intended joke can hit that close to home ;-)

The greeting by the organizers focused mainly on things regarding the schedule and facilities, making sure everyone had all the necessary information but had also enough room for a heartfelt welcome. Germafficiency for the win :-D

There was one thing though that annoyed me immensely. It was the first time at a conference where I noticed people using their coats, caps, bike helmets etc. to reserve seats during the whole day. Very classy guys.. next time why not bring towels.

We had lots of breaks, only coffee in the morning but lunch breaks were pretty long but that way everyone had time to eat without haste and in the afternoon we got ice cream sandwiches!!

The sponsors brought lots of goodies. MyTaxi even had 3 talks/workshops hosted on a boat just next to the location each day as a semi parallel track. The swag bag did contain not only the UIKong shirt and stickers but also a reusable coffee mug, a webcam cover, a mytaxi discount coupon and a notebook.




But now let’s cut to the chase...

Kaya Thomas - Inclusive and Accessible App Development [@kthomas901, kayathomas.info] <video>

A11y is an ever present topic at almost all conferences nowadays. But still too many sites and apps are lacking it. An aspect that other talks usually brush over though is the difference between a11y and inclusion. A11y features help to not exclude people but actual inclusion usually needs something more. Kaye used a good example: If a gym installs a ramp it uses a11y to allow wheelchair access but it is not automatically inclusive as there are likely still some issues when actually using the equipment.

Kaya also gave an exhaustive overview of available a11y tools and elements that can be used with examples. She also mentions that there are more things to consider than “just” ui elements but also that also users with a slow connection can be excluded if you rely on a huge bandwidth. A lot of those points reminded my about the talk of Charlie Owen at btconf, like including your users or some external QA authority to get more input on where your app might not be inclusive enough yet.

All in all a good talk covering the basics of a11y considerations plus a bit extra.

Shannon Hughes - Detangling Gesture Recognizers [@whattherestime4, github.com/whattherestimefor] <video>

This talk described the issues Shannon and her colleagues had when porting an application from MacOS to iOS using a rich set of gestures as shortcuts for a lot of operations.

As an introduction Shannon illustrated how different gestures are recognized using state machines. Debugging such gesture recognizers can be very tricky though especially when several recognizers are involved. Usual mechanisms like breakpoints do not work as they derail the timing setup.

Shannon describes their efforts and learnings in an extremely seasoned and also entertaining way. I highly recommend watching the video. The way she explains what bugs they encountered, what fixes they tried and why they failed is very diverting.

In the end the found out that too many gesture recognizers were active at the same time and had to reduce the amount in some way. In the end they created their own state machine, to define what gestures are recognizable at what time. 

This is a good example how a few seemingly small bugs can lead down a rabbit hole and force your hand into overhauling your architecture. Really good talk, interesting topic and a great speaker.

Glenna Buford - Rolling your own Network Stack [@glennersboofy, github.com/glenna] <video>

From the topic of the talk I was not sure what to expect. In a nutshell Glenna presented her approach to a lean and reusable networking layer inside an app without using 3rd party libraries.

The first approach simply an UrlRequest created from a string, classic network session etc. This got refined more and more by adding encapsulation and abstraction techniques. In the end she had different classes containing all the required data to access a specific endpoint and operation classes to be used with those. 

If you are into Swift programming techniques you might wanna check this one out.

Nataliya Patsovska - Declarative Presentations [@nataliya_bg] <video>

Another topic that can mean almost anything ;-) and TBH I am not quite sure I totally got the point.

Nataliya took us on a refactoring tour where she started from a completely synchronous program flow and turned it more and more into an asynchronous one using futures. As far as I understood the idea was to have rather generic classes that take futures and completion handlers as declarative arguments instead of having the traditional code flow.

This resulted in a code structure where the developer does not need to know when to check for what conditions or how to react to them but simply can define it by using an appropriately named handler/future parameter. This was emphasised by making use of Swift’s type system to make sure the classes are used in the intended way.

To me it felt like this was more suitable for designing SDKs or libraries so provide the developer with clearer interface. When you do that in the actual business logic there seems to be not too much benefit unless you have a lot of similar structured code portions that can be abstracted more easily that way. It might also benefit you during refactorings but I am not sure reworking existing code into such a structure in the first place is worth it. If you create a new application though it could be interesting to try this route.

But I gotta say, whoever does live coding that even just remotely involves XCode is either very brave or a madman ;-)

Kristina Fox - Internationalizing your App [@krstnfx, kristina.io] <video>

When you say i18n people immediately go for translations. Which is in a way correct but there is more to it.

Different regions can also mean having a different currency or regional differences like what an icon can mean or what associations are triggered by certain colors, screen orientation or units of measurement.

To find out about these differences user research is the main information source. If you gather that information yourself it is often useful to interview people at their workplace or even at home, places they feel comfortable at. Otherwise they tend to overthink their answers and the result is less authentic/natural. Another option are cultural consultants that can assist you with their expertise.

The second part of the talk focused on implementation aspects of i18n, like how to extract strings into a localizable and parameterizable format. How to use formatters to accommodate currency or time zone differences or the usage of start/end as opposed to left/right.

Ellie Shin - Mockolo: Efficient Mock Generator for Swift [@ellsk1] <video>

Here we have a highly technical talk. At Uber Ellie’s team was challenged with the task to generate a vast number of mocks at build time. Existing frameworks/libraries like OCMock, Sourcery or Cuckoo all had some drawbacks like need to subclass NSObject, use objc annotations or were simply too slow for the use case.

So what do we do in such a case? Correct, we build a new one from scratch ;-) Ellie explains the different steps they took to create Mockolo and what problems they encountered during this.

The topic was rather interesting but for me it did not contain much information to be used in daily work life. I mean, when will you need to write a code generator? Alas I have to say the talk itself was very hard to follow as it was very uninflected and a lot of complex information kept pouring in at a steady pace. But if you are into the technical details of Swift code generation this might just be what you are looking for. 

Julie Yaunches - Consistency Principle [@julieyaunches, yaunch.io] <video>

Never heard of that, no clue what it could mean. So I was curious what was coming down the pike.

During the life time of any application we all face the same challenges. The team maintaining the app changes, technology evolves and libraries get abandoned. So over the time you decide to swap certain parts of your application out for other things. But that hardly ever goes down smoothly or even atomically. So suddenly you end up having different libraries in your network layer essentially doing the same thing but you do not have the time to complete the transition. The same thing then happens maybe at the UI layer or somewhere in your business logic.

This kind of vertical duplications and inconsistencies is always a pain and of course we do not want them but in reality we often end up stuck in such a limbo due to non technical restrictions like time or budget.

So here Julie introduces the term of the Consistency Principle stemming from the accounting world into the IT landscape. In accounting you have several ways you can do your bookkeeping and the consistency principle tells you to stick to one method throughout a book and not mix bookkeeping styles. That sounds very sensible and plausible. 

But what does that mean in regard to the aforementioned examples? I think here is where she lost me and also other people I spoke to afterwards. Because if you apply this logic par for par it would mean NOT to change to a new library or abstraction pattern. Or maybe it means, if you do it, then only if you can finish the swap?

What came then instead were things like, make sure you encapsulate your application layers so that the business logic only has minimal knowledge of your network layer etc. But that is software architecture 101. So I fail to see the correlation between the initial problem description and the proposed solution. Maybe someone can enlighten me about it.

Lisa Dziuba - How to Market Your Mobile App [@lisadziuba] <video>

I gotta be honest, for me the term “marketing” is just.. well.. it just gives me the heebie-jeebies. But it is a very important aspect of a successful app and so we all should have at least a basic understanding about it, so we know where to start and what to ask people about if we need to get involved with it.

As a start Lisa defines the basics of user research, the term of a persona and what it is used for. Once you understand what your potential audience looks like you can start to think about what the USP (unique selling point) of your app would be to the different groups.

Subsequently Lisa gave a detailed overview of the different marketing methods one can use to promote and sell an app. It starts by communicating your app launch on all relevant channels like social media, publications or platforms like Product Hunt. Then we have direct sales mechanics, free marketing like influencers or viral marketing and then of course paid marketing.

Sally Shepard - Swift to Hack Hardware [@mostgood] <video>

Final talk of day 1. Hardware hacking talks are usually very interesting as they show you how you can break out of the usual confines we all get so comfortable in way too quickly.

Sally drew my interest right out of the gate by structuring the talk such as if we were new employees at a fictional cat bank :-D To really get the joke behind this, better watch the video. 

The project at hand was having money box to report what coin was deposited and what the total balance is. For this she setup a RaspberryPI with Swift-Arm and SwiftyGPIO to allow using weight sensors to determine the actual coin size. This also involved having analogue to digital signal converters and lots of other nerd stuff! 

Then on the server side she went for Kitura as a Swift cloud platform to provide data to the apps.

And here the talk took an unexpected turn (at least for me it was). After talking about all the different parts involved in the project, I was expecting to see the final result. But instead Sally switched her focus to something different but also important: the future of Swift

In summary it was an appeal to all of us to help the community grow and improve. Special mention was given to the Swift Evolution Process and its importance to the community and how we all can contribute to it (spoiler alert, it was not the last time we heard about that :-O)

So this somewhat left me in an emotional limbo. I appreciate the significance of the Swift community and its processes but I also wanted to see the kitty money bank do its job ;-)

Day 1 roundup

Pewh.. 9 talks in one day. Quite a lot to take in. Overall I must say that first day did not impress me that much. There were some really good and interesting talks and in total it was okay just not that great. But we have another whole day to hopefully blow our socks off!!

Monday evening at UIKonf features the so called Ambassador’s Dinner. Here an ambassador organizes a table at a restaurant so that nonlocals can just tag along without the hassle of finding a place for dinner on their own. This time there were like 6 different ambassadors where people could sign up. Lisa and I decided to go rogue though and had a nice stroll along some remnants of the Berlin Wall and the famous district of Kreuzberg to find some food along the way.




Day 2

Füsun Wehrmann - From Heroic Leaders To High Performing Teams [@fuesunw] <video>

Starting talk of the second day usually features a tough and slow crowd. But Füsun was definitely not impressed. We did get to enjoy an invigorating and entertaining talk that softened the start of the day.

We started off with a short travel to IT past, about things like how companies were structured or what the expected behavior at work was. She drew comparisons between now and then, how things changed in our working environment and technologies.

What happened when a project went haywire? Some expert got tossed into the maelstrom to save the day. Pretty often that approach just hit a brick wall and everything went south. Especially with changes like agile processes and self organized teams this approach is a recipe for disaster.

From here on Füsun outlined an alternative approach on what modern teams can do to increase their chances of success. This covers topics like customer and people centricity, shared leadership or collaborative mastery. 

All of this is already rather well-known but Füsun manages to illustrate the benefits and synergies in a fascinating way which IMO makes watching this talk worthwhile.

Erica Sadun - Swift 5 Strings [@ericasadun]

Erica Sadun, a name I never heard before, which probably shows how little I now about the Swift ecosystem. She is highly involved in the Swift Evolution Process and worked on several language proposals. But more importantly: She.. is.. a blast!!!

Seriously, this was one of the most entertaining talks I had the pleasure to listen to in a long while. She is very enthusiastic and funny and manage to carry me along for the full distance. So even if you do not care too much about Swift or programming at all, I recommend watching this talk simply for the entertainment value.

Edit: It seems this is the ONLY talk not available as video. This sucks BIG time!!!

Okay, back on topic. As the title says, this is about strings. Exciting, isn’t it? No? Well, give it some time. With a simple but effective C example Erica shows why using strings as control structures is a bad idea. There is hardly anything the compiler can do to spot errors and so the results are often undesirable. She substantiates this with the example of a date format string that yields several issues from wrong casing to i18n deficits. 

ExpressibleByStringInterpolation to the rescue!!! Or if you want it a bit more nerdy: SE-0228. This feature in Swift5 allows you to create extension to the existing string interpolation mechanism. The really great thing about this is, that those extensions can have typed parameters. 

This gives an immense boost in regard to compile time safety and abstraction. Since this are regular extensions you can add all kinds of logic into the interpolation code which is really powerful. Erica shows a lot of different examples of varying complexity. 

For me this was hands down the best talk of the conference, even though Erica labeled herself as the opening act for Ellen Shapiro ;-)

Ellen Shapiro - Kotlin/Native [@designatednerd, bakkenbaeck.no] <video>

Wait.. what?? Kotlin on iOS?? Yeah baby!!!!

But let’s start at the beginning and an hint for everyone going to watch the talk: Play it at like 80% speed otherwise your ears might fall off because, boy, she <i>does</i> talk fast.

There have been different approaches to try to have only one implementation for the different app platforms, like Xamarin or have Swift code run on Android. All of these attempts have severe drawbacks and turned out to be impractical. Many of these issues are unlikely to be resolved anytime soon as the parties that could do so usually have no incentives for it (e.g. lack of Java bindings for Swift).

Kotlin on the other hand was created by Jetbrains which has a strong interest in Kotlin being in as many places as possible.So it is also possible to compile Kotlin into LLVM code to be run on iOS devices. WOOOOOOOTT!!!!

The main part of this talk is Ellen talking about how she created a multi-platform project with Kotlin. I can’t give an adequate summary here, so better watch the talk and be ready for a verbal overkill ;-)

Alaina Kafkes - A11y-oop - Adding new Accessibility Features to not-so-new Apps [@alainakafkes] <video>

Another a11y talk but this time about how to add a11y features to an existing app. More specifically how Alaina und her colleagues added night mode to the Medium app.

I found it rather unfortunate that the talk consisted solely of slides explaining in prose what classes were added/modified for what purpose but not a single line of code. This made the whole talk very hard to follow and so I did not pick up on anything in this one.

Neha Kulkarni - Advanced Colors in iOS [@nehapundlik] <video>

Before this talk I was wondering what exactly could be advanced in colors ;-)

With P3 the IPhoneX supports a wider color space than its predecessors that use the standard RGB color space (ok, this sounds advanced ;-)) Sadly this is about the only thing related to P3, apart from how to use it in a color picker, in this talk. I would have liked to hear something more about P3 and the implications of its usage.

In the second part, Neha described how you can use semantic names and proper name spacing to improve maintainability of your apps. She also points out the importance of proper communication between e.g. design and development by using the correct names consistently and sticking to agreed names and naming schemes.

Lastly she emphasized that when choosing colors for your app or website you should try to have good contrasting, avoid color combinations that are hard to distinguish or simply painful to look at and that not only colors alone but also the combination with symbols can help to improve your app (kind of cycling back to a11y).

Anne Cahalan - Promises in iOS [@northofnormal] <video>

Swift has a variety of promise libraries. Anne gives an introduction to promises using PromiseKit with basic operations and elaborates on the implications to coding and mindset that come with switching to asynchronous programming.

At the end stands a short comparison of various promise libraries like Google Promises, BrightFutures or Hydra and a lookout regarding Async/Await.

If you are familiar with Promises you can probably skip this one, for others this can be a good starting point.

Julia Roggatz - Muse Prototype Challenges <video>

And yet again I was at a complete loss regarding this talk title. Will she be musing about challenges in prototyping. Are there challenges when prototyping a muse? I guess so, cause I would not have a clue how that should work.

Of course none of that. Muse is a prototyping tool Julia helped to developed at a research facility [@inkandswitch]. The whole presentation was held using Muse, which I thought was a nice touch.

At the start this seemed like a mundane product presentation and to some extend it was definitely a kind of advertisement. But once you look beyond that you see a new concept for creative working.

The tool allows you to nest so called boards infinitely. A board can contain various kinds of elements as well as free hand sketches and texts. It only work when using the Stylus which is a kind of exclusion (interesting counterpoint to all the a11y focused talks) but the idea was to see what a Stylus driven interface can look like and what you can do with it.

So I think this more an attempt in a kind of paradigm shift towards a new way of working which sounds interesting, even though I am definitely not the target audience. Another twist is that there are no menus or working modes (e.g. you select a drawing or eraser tool so define what the next click will do) instead you use additional touch gestures to change the behaviour of the pen or even the angle at which you hold it. 

So this could be interesting for designers or other creative people that would like to create something like a graphical mind map where you can include all kinds of documents or media.

Kate Castellano - What to expect when you are templating? Clue’s approach to Backend Driven UIs [@katecastellano] <video>

This was actually the only backend focused talk of the two days. The problem at hand is something every app has to solve if it does get data from a server.

How to create a reusable and maintainable architecture to send data about entities to display to your apps. The idea shown here is to define building blocks of your elements that can be reused to create new layout elements. Each block is described as a json element with a type. The apps know how to display each element and so you can control from the backend what the UI of your apps looks like.

That way it is easy or even mandatory to have the same names and definitions on all platforms, allowing more consistent experiences for users and developers. Also you can add new elements without breaking old apps but need to be aware that those might lack data then.

This is very similar to the way we built our apps at Süddeutsche Zeitung, so it was interesting to see, that others came to basically the same solution.

Lea Marolt - Mobile && Me == It's Complicated [@hellosunschein] <video>

I spent quite some time thinking about how to describe this talk. The best I could think of is some kind of “Coming of Age” for software developers.

Lea talks about her first experiences in software development and how she became more and more practised. Then after a while she felt a lack of meaning in her job and decided to build things in the real world. During that time she realized what aspects are easier when building software and found a new appreciation for the profession.

Summary

Looking back at the whole event I do have a rather positive impression. A good location, logistics worked out well and the organizers made you feel welcome. Some of the talks were a bit of a let down though but a few really stuck out. But 539€ for two days might be a bit steep for some.

If you are looking for a place for an exchange with other iOS enthusiasts UIKonf is definitely worth considering.

Dienstag, 21. Mai 2019

BeyondTellerrand Dusseldorf 2019

So we are once again back at the famous BeyondTellerrand conference in Dusseldorf, for it's 9th!!!! incarnation here. For me this is only the 2nd time I am here (3rd if you count the one last year in Munich, but I don’t) and it would not have come to that if it was not for my old/new colleague (long story there, ask me in person/comments if you really are that bored) and frontend wizard Francesco Schwarz [@isellsoap].

He was the reason I was here the first time, that one in Munich (the one that doesn’t count) and this year by nagging me to tag along. Even though my development focus HAS shifted a bit from purely backend to app development and also some dabbling in frontend technologies it still feels a bit odd being at such a place. 

In my experience most talks concern mostly design principles, working methodologies and creative processes. Of course there are always a few more techy talks around but those, as to be expected, concern web frameworks, browser developments and other flashy and shiny and sparkling thingies.

Don’t get me wrong, this is not a bad thing. Otherwise I would not be here. It is just a very different setting for me. Which is exactly WHY I keep coming back. Seeing what people can do with their creativity, how new ideas try to shift our perception of the world or what is even possible is quite refreshing. For me, this conference really embodies what it’s name promises: an opportunity to take a step back, broaden your horizon, see beyond your known territory and finding the courage to step out of your comfort zone (and maybe one day I will manage that).

Ok, enough huffing and puffing. Let’s get down to business. Francesco and I departed Munich on a shitty and rainy Sunday noon just to arrive to a lovely spring day in Dusseldorf a good hour later. Perfectly smooth journey from soup to nuts. Since we had a few hours to kill we had a stroll to a nearby park where we found a small restaurant and decided to stop for a snack and some refreshments.




After that we set off by foot again to the traditional Warm-Up event, this time hosted by the lovely people at wacom. Apart from chatting with other attendees and lots of free drinks and food we also got the opportunity to try some of their graphic tablets and see what can be done with digital ink. 




General Notes

BeyondTellerrand is a special kind of conference not only aiming for technical talks or focusing on a single profession. It is always about people. The speakers, the attendants and the community. Marc takes great pride in finding special speakers with unique backgrounds and maintaining a familial atmosphere throughout the whole event. This also includes promoting charity events on the stage and their own booth.

Something else that is different than at other conferences is the musical accompaniment by Tobi Lessnow. I am not a huge fan of electronic music but the way Tobi incorporates talks into his interludes and especially the show he puts in while thoroughly enjoying his music adds a special kind of flavor to the ambience.

The videos to the talks can be found on the coverage page

A new addition was the screen with live captioning. Both Francesco and I were surprised by the speed and accuracy of the captioning as it was also able to apply quotation marks correctly and were wondering what software was behind this. Then we found out how it worked. The audio went into a skype call to some place in Scotland where a guy called Andrew simply typed what he heard which was then sent back ;-) 

Day 1

In addition to the regular talks the first day also featured 3 side events hosted by some of the sponsors in a side room with a max of 100 attendees. First one was the…

Shopify Breakfast Session - Liam Griffin [@liam_at_shopify]

If you already know what shopify is all about, this talk is not for you. For everyone else, go have look. Liam is giving an overview of what shopify does, how you can use and integrate it.

He is giving a quick summary about how other companies are working with shopify and what advantages they gain. You can also see what options you have in theming shopify and what kind of services are available.

You can also create development accounts to have test orders processed and toy around with different settings before migrating them to the production accounts.

The “techy” part of the talk was a short intro to the Liquid Objects templating language with some basics. IMO not much different than other templating mechanisms, it allows you to put data into your layout ;-)

Liam also gave a quick overview over different ways to edit and manage your themes with tools like slate.

In the end this was more or less a little pr gig for shopify but it was done in a nice way and you can’t blame a sponsor for trying to get more attentíon for their product. And there were free subs ;-)

All Constraints are Beautiful - Charlie Owen [@sonniesedgesonniesedge.net]

Official opening talk. Always a tough job to get the crowd started. But Charlie did just that without breaking a sweat. The talk was not only very funny but also fascinating. Check out the video.

We face constraints in almost every situation of our lives, be it professional or personal. Charlie illustrates this with the fitting analogue of baking a cake for some friends. Some maybe be vegan or cannot have gluten or might even have a life threatening allergy. So baking a cake for all of them is really really hard. So why not just go to a bar instead?

Funny as that is, it has also a lot of truth in it. Usually we perceive constraints as something that is hindering us, something that restricts us in our choices and we therefore regard them as something bad and assume that our work will not be as good as it could be due to these evil constraints.

And here is where Charlie proposes a different approach. Do not fight the constraints, accept and embrace them, let them be a contribution to your work. Some of the examples she lists are haikus or other forms of poetry that attain at least some, if not all, of their beauty because of the adherence to constraints.

Another very moving example is a quote that allegedly stems from Ernest Hemingway. It is said that he made a bet he could write a story containing only 6 words. It sounds rather unlikely but what he, allegedly, came up with was this:

“For sale: baby shoes, never worn”

You might wanna let that sink in for a while. 

The main point is: Constraints are not inherently bad, some can be good but most of them are at least necessary. So do not ignore them when you create content, applications or other resources.

But this is actually not the first step. Before you can acknowledge a constraint you must be aware of its existence. Try to remember that there are people with all kinds of needs, preferences and disabilities as well as all kinds of devices out there. Not everyone in the world has a current device or even a moderately common one. Charlie tried to summarize this with this:

“There is infinite technology and infinite humanity”

Ultimately if everyone only builds apps that need the newest hardware we are encouraging people to buy that hardware which causes not only a lot of resources being used to produce said hardware but also will result in more and more older devices being thrown away and polluting the planet even more.

You might find that last conclusion a bit extreme and I agree that relying on a new tech will not cause immediate death of the planet but it is a small part of the bigger problem and even baby steps matter.

Humanising Your Documentation - Carolyn Stransky [@carolstran, carolstran.github.io]

“Oh yeah, writing documentation!! Awesome!!!!” That’s what we are all thinking when that task comes up, right? Uhm.. ok.. maybe not quite as enthusiastic.

That might be a part of the problem. Carolyn tries to point out what a good documentation can and should look like. Consider an app or api you have created, how good is the documentation for it? Did not bother to write one? Or maybe just covered the basics because it is mostly self explanatory? Sure about that?

Carolyn’s background as a technical writer has given her an insight into what usually goes wrong when we write documentation. I will just try to sum up the IMO most important points, if you are interested in more, I recommend watching the video.



What should we take into account when writing documentation:
  • Do not start with the documentation when you are in the implementation phase or even later. Embed the documentation into you design process when you specify the use case you are going to implement. Make sure it gets updated as the specification evolves and use it as acceptance criteria to see if everything behaves as you specified
  • Do not only describe what a buttons does or how an api endpoint can be used (reference doc) but also create documentation telling the user how to achieve something with it (use case documentation) e.g. how several api calls can be combined to complete a workflow
  • Consider when people are usually reading docs, like at the same times when you are reading docs: 
    • When you failed to do what you wanted on your own
    • When something is not working as expected
    • When people are frustrated or confused…
She also gave a long list on how you should write docs, with an extensive list of tools and guidelines, here are only a few:
  • do not use words like "easy", "simply" etc.
  • it is better to show than tell (examples, videos)
  • take a step back and consider that readers do not have your knowledge about the product
  • use tools like hemingway, write-good or alex.js
  • use a clear structure
  • a11y!!!
  • ….

The Power of Metaphor - Mike Hill [mikehill.design, mikehill.design]

Here comes deluxe nerd stuff. A talk including super heros, magic, sci fi, dinosaurs and much much more. So buckle up!

Mike’s résumé reads quite impressive. He worked in different positions like production design, concept design, etc. on various high profile projects in the filming and gaming industries:
  • Horizon Zero Dawn
  • Call Of Duty: Infinite Warfare
  • Blade Runner 2049
  • Love, Death + Robots
  • ...

During his illustrious carrier Mike did learn a lot about what a story and the world it takes place in need to captivate the audience and more importantly what kind of mistakes killed high budget fails.

The core concept of Mike’s talk is a construct called the Monomyth. This is an abstract concept that describes the typical journey of a hero in a detailed sequence of phases. This is nothing new but was developed in the 1940s and is based on an analysis of narratives from ancient mythology until modern stories. Almost all great heroic stories can be ascribed to the Monomyth.

I’m trying to give a rough description of the Monomyth but I highly recommend to watch the video as Mike shares a lot of fascinating insights, plus a huge amount of blockbuster material. Depending on the granularity the Monomyth can have a lot of different phases. The most basic one consists of four.

  • The known and the old self: This is where a story begins. Mike used Star Wars as an example here. At the start Luke is at home living his live, then comes a call to adventure in form the message from Lea. Luke meets his Mentor Obi-Wan but at first refuses to follow the call until some tragic events force him to go.
  • The unknown and the old self: Here the hero finds allies, here Han and Chewie, has to pass tests make friends etc. until he has some kind of traumatic experience that leads a form rebirth (the dumpster scene)
  • The unknown and the new self: The hero finds some kind of reward for his struggles and fully transforms into his new self.
  • The known and the new self: Our hero returns home usually triumphant etc.

As I said, this is a very condensed version. Watch the talk for a better understanding.

The second concept Mike introduced is the reciprocity of Shadow and Persona. Persona describes a person’s outward behaviour. Our manners we learned by aspiring to meet expectations by our society, family or even jurisdiction. Where as the Shadow resembles our instincts and subconscious desires that we learned to suppress because they are not appropriate. In comics these two are usually represented by an angel and a devil sitting on the shoulders of a character trying to persuade him what he should do.

Furthermore Mike explained the terms the archetypes Chaos, Control, Animus and Anima using Jurassic Park.

Animus describe the attributes traditionally associated with males, like sternness, protection or strength. While Anima describes the traditionally female attributes like nurturing and loving. In Jurassic Park those two archetypes are represented by Grant and Ellie who during the evolution of the story both must learn to also develop the qualities of the complement archetype.

The Control archetype is usually assigned to some god like creator, someone who is in charge and wants to make the world better. In this example this archetype is taken by the role of Hammond, the director. He is creating live, a whole world. All with good intentions and is sympathetic to everyone, even towards Malcolm the representative of the Chaos archetype. He is stirring things up, questions the Control archetype and is generally a huge pain. As the story develops these two need to understand each other’s positions and learn to work together to save everyone from disaster.

Again, this is only scratch on the surface of this talk. Go watch it now!

Trivago Lunch Break Session: Lessons Learned From Running a Design System - Christoph Reinartz [@PistenPrinz]

Christoph shared his experiences when he joined the folk at Trivago about the status quo he found, his aspirations to improve on the situation and the learnings he took from this.

When he joined Trivago the website, despite just having undergone a rewrite, was in a chaotic state. There were no style guides or processes to design changes. Sometimes there were just screenshots in a JIRA ticket and the developers used a color picker to determine what color to use. That resulted in about 40+ different tones of grey and similar multitudes of green or orange. CSS and HTML were in a desolate state.

Christoph and his team set out to change this and started to implement a design system as a pattern library to unify the diversities. Over the years they put in more and more effort but struggled along the way as there were a lot of problems to correct. At one point they analysed the usage of their lib was hardly used in the main Trivago website but mainly in side applications.

Several other issues finally lead to the abandonment of the library even though a lot of time and effort went into it.

I found it very courageous to hold this kind of talk and openly speak about a failed project of these proportions. After all usually people only talk about their successes but our failures is where we and others can learn the most from.

His main learnings where that if you want to talk a problem like this you need to start small. Do not approach all problems at once but limit yourself to the most pressing ones. On the other hand you should aim high, meaning that you should try to build a good and well thought through solution, because a lukewarm approach will raise other issues later on. And finally try not to underestimate the difficulty and complexity ahead, do not approach it light-hearted or it will come around to bite you in the arse.

Making Art With Familiar Objects - Red Hong Yi [@redhongyi, redhongyi, redhongyi.com]

I will say this for a lot of talks in this post but seriously: Watch that video!!!!

With most talks about creative work a simple description here does not do justice. Red takes us on journey through her creative and personal life which are both intertwined closely. I will only give a few short examples of her work but, I gotta say it again, watch the video.

She started of by showing how she painted a portrait of a Chinese NBA player but instead of using a brush, she dipped a basket ball into the paint and dribbled it on the canvas. 

Another one was where she used socks connected with clips as a kind of pixels to create a huge picture.

Or bundling chopsticks in packages of different sizes to also create a pixel style portrait of Jackie Chan (and I apologize for not memorizing the names of the other people portrayed).

Throughout the talk Red inspires with her authentic and honest love for art. So go and click that video link!

Never Snap to Guides - David Carson [@d_carson_design, davidcarsondesign.com, davidcarson]

If there is one thing to say about Dave Carson, he is a special kind of snowflake ;-) which I say with a lot of respect. His carrier is characterized by his strive to challenge conformity.

This was less like a regular talk but more like a fast forward slide show through his life and work showing an immense amount if diverse designs, logos and layouts, as well as some design fails he encountered on the way. All accompanied by funny anecdotes. We had a lot of laughs in this one.

What I took away from this talk can be boiled down to this: Tools are there to assist you but not to make decisions for you. You have to decide what a design should look like not the tools and not templates that “everyone uses”. Also if you have different ideas, let your customer choose from them, do not withhold alternatives from them. 

But apart from that, you guessed it, watch that video ;-) But when it gets close to the end, make sure to sit down. You will know what I mean when you see it.

Hard Work, Relentless Dreams and WiFi - Rob Draper [@robdraper1robdraper1, robdraper.co.uk]

This was hands down the most personal talk of this conference. Rob shared his life’s story with us through all the ups and downs and how he kept on pushing to get back up.

In school he started doing graffiti which got him interested in art. He then worked at a fashion store building props from all kinds of things always struggling with a tight budget. Then the shop was bought by another company and was closed down to move north of England.

So he was out of work and had to find day to day jobs to survive. At one point he started drawing on cups in coffee shops just for himself. He kept drawing and drawing and at one point a newspaper found out about his great drawings and published an article about him. From there on he got more and more publicity and job offers.

He had a house, a family, his office at home, life was good. But then the downward spiral hit again. A Burglary where people stole a lot of stuff from his shed, his dog dies unexpectedly and then his wife wanted a divorce.

Rob had to move in with his sister and had a deal with his wife, that he could use the office at the house during the day, so he was driving back and forth and figured he would soon be able to move out of his sisters living room. Then he got pulled over by the police because his car insurance ran out and the car got confiscated plus he suffered from a bad case of sciatica. Due to his housing and financial situation no bank would loan him money.

What helped him to keep moving instead of giving up, was his son. He wanted to be able to provide him with all the things a kid should have. After some time he realized, he did not need an office, he could work anywhere where wifi was. So he got the cheapest possible tripod he could find and set out to do more of his “play work”. Uploaded it and kept pushing to find new clients.

Thanks to his persistence he succeeded. He kept pushing against all odds and came out ahead. This story in itself was already inspiring but add in his really amazing drawing skills and you have a great talk.

This talk is worth to watch as well in my opinion.

Mozilla Evening Break Session: VR and AR in the browser, how Mozilla is pushing the boundaries of reality - Fabien Benetou [@utopiah]

Fabien is very passionate about not only VR/AR but also about the open source culture and helping others. He is working with UNICEF to help bring education to people in developing countries.

Mozilla is investing into web based VR development for several reasons. They want it accessible to as many people as possible. Companies like Facebook or Google also develop VR devices but they keep it proprietary enclosing their users in their ecosystem. This is a development Mozilla considers not only undesirable but also dangerous and thus they want to help providing a standardised and open alternative.

With WebGL 2.0 exists a way to have performant VR applications in the browser. It is still not perfect but the evolution is a long way from done so they expect to improve the experience more and more.

Imagination, Desire and the Call of the Future - David Delgado [davidjdelgado.com]

Okay, last talk of the day. Everyone is a bit exhausted and I am afraid I might drift off soon. But that was washed away after a few minutes.

I mean, how can you get bored when someone tells you he is designing stuff for NASA at JPL? Admittedly nothing that goes to space. Instead David created projects to either raise people’s interest in certain missions or to visualize data.

E.g. when the Rosetta mission was about to land he created an artificial comet in a pool with fog to see how people would react to it, yielding unexpected and interesting results.

Or when he was shown Goldstone areal (big antennas to communicate with the different spacecrafts in orbit) he create a waterfall of light that shows in real time when data is transmitted from or to a spacecraft.

Once again words are not enough to describe his cool projects especially a music video he made with school kids about traveling to mars. Just check it out!

But if I had to deduct a moral from this it would be: Curiosity can outgrow fear.

Humans just need a small glimpse of hope to overcome fears and dare to leap into the unknown. Embrace your curiosity.
Get-together and evening beer
As usual the end of the first day has the obligatory get-together to discuss the events of the day with free drinks from the bar.

Day 2

I Don't Care What Airbnb is Doing - Stephen Hay [@stephenhay, the-haystack.com]

Kicking off day 2 is probably the hardest challenge a speaker can be confronted with. You have to deal with the audience’s expectation after the first day plus the fact that most are probably quite hung over.

So Marc gave this task to a veteran and only a few minutes in he had gotten everyone on their toes. Stephen started by cycling back to day 1 incorporating parts of the talks as references into his own.

Like Dave Carson he stressed the point that if you want to be different then be different but not in the same way that everyone else is different. He reenforced this statement with a lot of fitting examples how most of the “hip” websites just look the same.

As I already touched on in the prelude, nothing exciting happens in the comfort zone. You need to push the boundaries in order to create something special. An example for this was the design of Tesla. It still is a car, it has wheels, a body, headlights and windows. But it’s inside feels different, not so different that you can’t relate to it, but different enough that it changes the way you interact with it and perceive it.

We are prone to try grasping the low hanging fruits of creativity but instead we should try new things. Learn from what we find out be it failure or success and then start over again. But most of all we should be critical thinkers. Do not accept what “everyone knows” make your own experiences. And with regard to that you should not take my word for granted but see for yourself ;-) Again a video well worth watching.

Data, Design, Code - Shirley Wu [@sxywu]

It is always impressive when you see what a skilled visualiser can do with simple data.

Shirley gives us an overview of her previous works, what different aspects of data can be used to group and finally display it.

Actually what I remember most of this talk is something rather sad or even upsetting about the data of one of her projects. It seems that it is common in the US for cities to have their homeless stuffed into busses or even planes to bring them to other cities or maybe even other countries!! TBH that made me sick!!!

But back to the matter at hand. One part of the talk was a live coding session to recreate one of her visualizations. It was interesting to see how the different tools can work together to create great animations. Unfortunately the live coding was maybe a bit too well rehearsed as it was really quick and therefore a bit hard to follow.

What impressed me though was that Shirley combined D3, VUE and Greensock in a tool stack by replacing mechanisms in one with equivalents of the other in order to make the code more lean.

The Scoville Scale of Web Font Loading Opinions - Zach Leatherman [@zachleat, zachleat.com]

Zach is a Web Fonts enthusiast through and through. As it seems he is also into spicy food as his talk is divided into different steps referring the Scoville Scale. So brace your brain and taste buds for Web Fonts hotness!

The main reason why Zach advocates the use Web Fonts is that you should give your reader the best reading experience you can. Of course saving bytes is an important aspect of a website but in his opinion the extra bytes needed by Web Fonts as opposed to system fonts is worth it.

The different heat levels in Zach’s talk related to different things you should consider in regard to fonts on your website.

Often font declarations can be simplified especially when they refer to default fonts. The so called bulletproof font face declaration can also be shortened. Mixing local and url font-face declaration is discouraged.

If you want to find out more about the fonts used on a site you can use the fonts tab in the firefox dev tools. Also fonts are a kind of software so they also need maintenance and updates.

As with every talk about Web Fonts there was also the well known Romney example for a FOIT. Here the new directive “font-display: swap” is useful as it will cause the fallback font to be used immediately and then being swapped out once the desired font is loaded.

Two more sections that I found interesting was the overview of different licencing models available for Web Fonts as well as hosting options.

As with all talks before this is only an excerpt and I once again recommend the video (again a lot of laughs) at least if you are interested in Web Fonts at all.

Microsoft Lunch Time Session: “Edge on Chromium” Ask me anything - Chris Heilmann [@codepo8], Working Draft Podcast [@workingdraft]

This was designed as an Q&A session for the attendants but in order to get things started the guys from Working Draft podcast kicked it off with some questions.

The whole session was recorded by Working Draft and will be up on their podcast within the next weeks.

What concerned people the most was why the team decided to take this step and if that does not give too much power to Chromium or on the other hand makes life too hard for Gecko.

In the start the Edge team set out to create a browser that is as standard conform as possible. But soon they encountered problems as many many sites on the web did not conform to those standards and so did not work in Edge. Breaking the web was not an option for them, so they tried to cope with those sites but in the end it was just too complicated.

So they decided to contribute to the Chromium project instead. In their view this gives them the advantage of a browser engine that works well also with non standard sites and on the other hand has the benefit that there are now two big players in the Chromium project so not all the power is in one hand. Also this allows them to release Edge independent of Windows so they can have shorter release cycles.

On the other hand they hope the Gecko engine will continue to be around to have more diversity and not only one engine for all browsers. IMO this sounds a bit hypocritical as the Gecko guys could use the same arguments to switch to Chromium, but it is their (Edge) call.

Having two big companies with a say in the Chromium project also gives rise to the question, what happens if there is a disagreement? The only answer there was basically “We expect that not to be a problem as everyone in the project wants a pragmatic solution.” This view is underpinned by the fact that the real distinction among browsers does not stem from the engine but from what the browser does with it.

Other news were that the old Edge will be replaced once the new version comes out but Internet Explorer will still be installable in parallel. Also Edge will have a list of sites only working with Internet Explorer and open all these sites in a tab using the Trident engine. Plus links opened in the Trident tab that do not require the engine will be opened in tab with Chromium engine.

Also a lot of the features from the existing Edge engine are ported to the Chromium project.  Edge will come to Mac and Linux system and a release will use most current Chromium version.

Napworking - Dorobot [@dorobot, dorobot, dorobot.de]

Who doesn’t like a good nap? So does Doro and she now even found how this helps her creativity. In the minutes when she is having a lie down on the couch letting the thoughts drift off shortly before falling asleep the best of ideas arise.

Unfortunately this does not work for all of us, as having a nap at the office might cause issues with the boss ;-)

In her amusing and wonderful talk Doro takes us on a tour through her world of lovely weirdness. If this talk was not worth watching for the animations on themselves she gives us delightful insights into her way of thinking. From “boring your brain” over “lateral thinking” to the “right to be inefficient”.

There should be something to take away from this talk for everyone.

Flexbox Holy Albatross - Heydon Pickering [@heydonworks, heydonworks.com]

As much as I appreciate the creative talks on BeyondTellerrand I was really happy to see a pure technical talk. 

The problem at hand: Flexbox allows you to have items placed in a single row on a wide screen. In a very narrow layout the same flexbox puts all elements in one column. In between these two edge scenarios elements are placed in a kind of grid where the elements in the lowest row get stretched out to align with the other rows. This middle step is sometimes undesirable so Heydon wanted to find a solution to skip it.

This introduction was followed up by another funny and very informative talk. So again, watch the video as I can yet again only give a brief summary.

Whenever Heydon started discussing this idea some people suggested media queries. The issue with this approach is, that media queries take the dimensions of the device/viewport into account and not that of the containing element. So this is not a viable solution.

What would be suitable are container queries but according to Heydon using those caused severe browser issues. What works is a javascript based solution using observables to react to the parent element’s width but what we want is a pure css solution.



What follows is a description on how to combine different css properties and functions (calc, width, ..) in more and more complex steps leading to something called the Fab Four technique that was already developed before Heydon got to this point. But Heydon keeps on improving and refining the solution into a more elegant version of algorithmic layout in pure css.

Even if you are familiar with the final result, the talk is still worth to watch, if only for the entertainment value.

Take Back Your Web - Tantek Çelik [@t, tantek.com, tantek]

In the previous instances of BeyondTellerrand I attended the last talk was always something light and breezy. An entertaining talk to release the audience with a smile.

This time it was different. Tantek is an advocate for the IndieWeb movement and highly involved with the W3C. He is one of the driving forces behind the developments for an independent web for everyone.

Using strong pictures and videos Tantek shows us, what the web should and could be about. How we should shape it to what we want it to be instead of relying on platforms like Facebook or Google to tell us what to watch and read.

“Take Back Your Web” is the perfect title for this talk and something we all not only should but have to pursue. Apart from preaching of what not to do, Tantek also shows what can be done to have unique and independent presence on the web. He introduces tools from a starter kit for your own github web site (indieweb/blank-gh-site) to WebMentions and MicroFormats2.

It was a very seizing presentation for the IndieWeb movement and if you are not yet familiar with it you need to watch this talk.

Summary

As with the previous editions I attended this was a very worthwhile experience. This is not just another average conference, something about the way Marc is running the event and talks to and about other people on and off stage makes it very special. It is actually hard to describe but it just feels different than all the other conferences I experienced. If you are up for a conference that does not solely focus on technical topics and feels somehow warmer and cosier, then you should sign up for the next edition.