Don’t be scared of the “C” word: Part 1

Content is king, how many times have you heard that?

As true as this statement is, it is fairly nondescript and pretty generic. Content is king, but quantity does not necessarily mean quality. More often than not you’ll come across a website with paragraph after paragraph of copy that will never get read due to the viewer ‘tuning out’ not long after the headline…if they’ve got that far.

image

When putting together a content strategy, whether it’s for a new project or an already established website; there are several key objectives you should keep in mind. Here are a few areas you should consider.

Reading habits

Before we get into the nitty-gritty of the content, its well worth taking some time to understand viewers reading habits. The process of reading copy on a screen or through a web browser is very different to reading a book or magazine. A user will skim-read through content on a screen rather than have a concentrated read, line by line, as they would tend to do with a book or magazine.

Also, a reader will tend to bounce from one page to another, possibly sharing via Twitter or another social network. Majority of the time this is done without the viewer reading the page from top to bottom.

So how do you keep visitors on your website?

Well, if I haven’t lost all of you through the ‘reading habits’ I mentioned above we will cover this below…

Write for your audience

Before you sit down and start pounding away at the keyboard, take five and think who are you actually writing for. The tone and structure of the content for a website offering legal advice would be drastically different to that of a website offering equipment and advice for extreme sports.

image

Put yourself in the place of your target audience. How would you communicate and what would you want to know about if you visited your website?

Originality is the key

This doesn’t mean you have to write a masterpiece of English literature straight out of the box. Rather, make your content your own, not something you have patched together from ‘cutting and pasting’ content from other sources. You may think this will pacify the masses … whether that’s your target audience or search engines, but you would be very wrong on both counts.

Starting with the latter, search engines are more intelligent than you will ever be … FACT!!! Google for example, being basically the proclaimed centre of internet searching, puts a lot of effort into heading off this problem with a lot of very clever people and some super groovy algorithms that can jump on this and penalise your website accordingly. Now, there are also many intelligent people out saying that this is not the case, the ‘duplicate content’ issue is just a myth; and they may be right. The question is, are you willing to take the chance?

Lets play devil’s advocate for a minute and say that a ‘duplicate content’ issue is non existent within Google or any other search engine. This brings us back to the first point we discussed a couple of paragraphs ago. Cutting and pasting content from a similar website may well pacify the masses and keep your target audience happy. However, in this day of Facebook, Twitter and many other forms of social sharing, how long do you think it will be before the ‘original author’ stumbles over their own handy work or your website? For just a little time and a modicum of effort you could create you own content and tailor it specifically for your audience.

Always keep in mind; the more your viewer can take from your content, the more likely they are to return to your site, share your content and remember what you had to say.

Make those headlines sticky

How many times have you walked into a newsagents, glanced down at the newspapers and done a double take because a headline has caught your eye? Exactly the same principle applies for online content. It is in fact reported that as much as 80% of all traffic to your given piece of literary genius will NOT read it. That leaves just a paltry 20% to read your article, if you manage to keep their attention after the headline.

image

A good headline needs to grab and intrigue the reader, making them want to read on. This holds true on any platform, whether its a blog post, a social update or a PPC (Pay Per Click) advert.

Remember, as much as the content you are producing needs to be informative and relevant, its objective is to generate interest. Well written content should guide the reader from one sentence to the next, and then to the next. Good original content will keep your audience engaged until they reach that all important ‘call to action’ … whatever that may be, thus fulfilling its sole purpose.

This, of course, is as long as the content doesn’t seem to similar to something else they have read on another website.

Those pesky search engines

Well, you can all breath a sigh of relief because we’re not going into this minefield just yet, that will come in part two. However, I can’t write an article on content without touching on this, however brief it may be.

image

Whether we like it or not, search engines have become the central hub of the internet; and Google is by far the biggest fish in this pond. When you are putting your content strategy in place you really have two options…

  • Scrape and steal content from other sources, pass it off as your own and run the risk of Google’s wrath (especially following upgrades to the Panda and Hummingbird algorithms) and that of the original author.
  • Or, take some time and effort to write your own copy, targeting your specific audience and nurturing engagement.

In part two we will be covering Search Engines, SEO (Search Engine Optimisation) and how to make your content work in other ways.

The Etch team keeps on growing

2014 has been a busy year for Etch. Over the past few months we’ve been pleased to welcome several new members to the team. Matt, who was a freelance regular, joined us as a full-time Web Developer, and then Paul, who came aboard the good ship Etch as our very own Design Psychologist, also joined the team.

We are now very pleased to welcome Cara to our team. Joining us in the position of Digital Marketing Executive, Cara will be working alongside Chris, managing clients’ digital marketing activities.

image

As an experienced copywriter and graphic designer, Cara’s skillset will prove an asset to the team. Whether creating and managing advertising campaigns or developing and implementing marketing strategies, Cara will be one to make sure the grammar, tone and focus of your content is honed and ready to go to work.

Good Tidings We Sing

Hello,

Here at Etch HQ, we’re all very busy putting the finishing touches on websites which need to be live before the end of the year - However, that hasn’t stopped us from compiling our favourite Christmas tunes into a nice little list!

What are we waiting for? Let’s get merry!

Adam - Santa Claus Goes Straight To The Ghetto

The rapping here is more fun than actually wrapping your gifts. It was a close one between this and the Wizzard classic “I wish it could be Christmas every day”, but who can refuse the two dawgs?

Nate Dogg – Santa Claus Goes Straight To The Ghetto

Cara - Jingle Bells

My musical choice for Christmas is… Jingle Bells, because its irresistibly catchy and everyone knows the words. 

Perry Como – Jingle Bells

Caroline - Christmas Wrapping

Described by The Guardian in 2005 as a “fizzing, funky dance-around-the-Christmas-tree music for Brooklyn hipsters”. If the hipsters like it then it’s got to be good right? Like beards. And fixed-gear bikes.

The Waitresses – Christmas Wrapping

Chris - Fairytale of New York

Not a massive story aside from it reminds me of getting swallied in Kinloch Rannoch with a bunch of Scottish folk. Just reminds me of happy and fun times with a good bunch of mates. I remember “Old Bean” screaming … Drink! And me screaming … SWALLY!

The Pogues – Fairytale Of New York - feat. Kirsty MacColl

Suzanne - White Christmas

I’m not sure if it’s my favourite, but ‘White Christmas’ sung by Bing Crosby makes me think of the fun Christmases I had as a child; in particular, one year when there was a thin covering of snow on the ground, and my brother, sister and I decided to build a snowman. We worked hard all morning collecting snow in a wheelbarrow, but before we could build the snowman we were called in for lunch. Unsurprisingly, when we returned to the wheelbarrow later our snow had melted away and we had no snowman to show for our hard work. Hugely disappointing as a child, but very funny to remember as an adult!

Bing Crosby – White Christmas

Tom - Have Yourself a Merry Little Christmas

For the pre gorge, get me another cocktail while I sort the final foodie bits!

Ella Fitzgerald – Have Yourself a Merry Little Christmas

Kamila - Last Christmas

It is really hard for me to come up with my favourite Christmas song. Although, I celebrate and enjoy it, I am not really into Christmas music. If I really had to pick one, I would choose Wham Last Christmas, because it really puts me into festive mood. I probably first heard it while at college and it was likely the most played Christmas song at the time (at least at the college I went to). It reminds me of our trip to Portsmouth Christmas market we went to with our class.

Wham! – Last Christmas - Single Version

Paul - Funky Jesus

It was a hard decision not to go for Shakin’ Stevens but this just edged it out due to the general lack of Christmas organ funk – and the way it goes mental three quarters of the way through.

Funky Jesus - The Jive Turkeys

Stu - Linus & Lucy

Why is this my favourite Christmas tune? It’s pretty simple really in a fluffy parent kind of way, it always reminds me of my girls. Since my daughters where little, the film we have always watched religiously on Christmas Eve every year is ‘A Charlie Brown Christmas’, it’s our own little Christmas ritual….and after all, nothing is cooler than Snoopy, Charlie Brown and some bad-ass jazz.​

Vince Guaraldi Trio – Linus & Lucy

Shelly - Silent Night

I like carols!

Why do I like them?

Christmas is about remembering that a saviour was born into the world, bringing peace and hope for all mankind. (I should be writing a carol…)

It’s not about snowmen or presents or eating too much food but JESUS IS THE REASON FOR THE SEASON …lets not forget that.

Carols remind us of this.

Sinead O'Connor – Silent Night

Simon - Stop the Cavalry

It was a close run between this and fairy-tale of New York, but this one won out. It’s not the normal ‘cheesy happy feel good’ song but I like it as it’s actually a good song and not many Xmas songs are (sadly the message is relevant every year).

As a song it enables me to picture in my head the family household around Christmas way back in the 80’s, and in particular my brother who bought it an showed me the picture on the 45’ vinyl… yep vinyl! Quality street, potatoes and parsnips, wrapping paper, dodgy Xmas decorations, the dog, my Gran… the list is endless, I won’t bore you J  Merry Xmas Mr Churchill and everyone else.

Jona Lewie – Stop The Cavalry

Matt - Kidnap the Sandy Claws

This is a mix of one of my favourite christmas movies ('Nightmare Before Christmas’ for those those uneducated folk) and one of my favourite bands. You may be able to tell that conventional christmas songs aren’t my thing… 

Korn – Kidnap The Sandy Claws

Phil - My Only Wish (This Year)

Even though I groan and moan about the Etch Christmas playlist every year, it was me who added this atrocious Britney Spears ditty to the list, making me a massive hypocrite!

Britney Spears – My Only Wish (This Year)

Maria - Rudolf the Red Nosed Reindeer (As sung by the Christmas Cats)

Meow!

Michael - Christmas Lights

Coldplay – Christmas Lights

I say I like Coldplay, when actually, I’d rather be listening to Justin Bieber – Drummer Boy <3 

Time for something retro..

Next Stop Hollywood

On Wednesday morning, Caroline and myself faced a dilemma.

We had our team (Bolstered by Steve and Ellie) for the Soton Creatives Lego Stop Motion contest, and we wanted to recreate a film, but we needed to agree on one which we all liked.

Forrest Gump?”

“Something classic… Something like Back to the Future or Jaws or something”

“I like Jaws.”

“I like Jaws!”

The idea was born. We decided to dedicate a whole evening of our lives to bringing a scene from Jaws to life, and after Tom promised us a free lunch if we won, we set about making our plans.

image
This is the chef, preparing the free meal Tom is going to buy me

We printed off a sea background, made a storyboard and gathered the necessary filming equipment - We ended up using one iPad to film, two phones for additional lighting and two boxes of Pirate themed “Lego” (It wasn’t real lego, much to the mild chagrin of Lego Movie fanboys everywhere).

image

In tribute to one of the best horror films of all time (And surely, the best shark film of all time… Sorry Sharknado) we constructed a scene where two men at sea come face to face with a big ass shark.

image
Not Jaws

Naturally, they proclaim their need for a bigger boat, complete with a dolly zoom effect before both falling victim to the nefarious selachimorpha (Yes, I googled that) encircling them.

image

2 hours or so later, we had our completed masterpiece! I don’t want to oversell it, but it’s pretty much the Citizen Kane of shark movie themed lego animations. The judges seemed to agree, and awarded our team 1st place, which was a real honour.

Anyway, enough yammering - You want to see this thing, right?

This is better that the Jaws sequels. I’m not even kidding. Thanks, Soton Creatives!

- Adam

User Experience - it’s all emotional…

So, ‘user experience’ - what is it? You could ask numerous people in the industry what their interpretation of user experience is, and most will be able to give you a relatively accurate description. However, as with any industry, anyone working within it will be able to offer up descriptions and definitions of terms relative to their own specific field. If you ask a mechanic what ‘Mean Piston Speed’ is, they will tell you it’s a “rule-of-thumb” equation for engine evaluations.

If you’re anything like me, you would have glazed over at the mention of equations, mean speeds, etc., and to be brutally honest I wouldn’t blame you. There is nothing worse than being mentally bombarded by someone else’s attempt to ‘over’ explain an issue with terminology that is either vague or that you just don’t understand.

Our interaction (experience) with, and the use of, such things as smart phones, tablets, PCs and many other everyday items has come under close scrutiny of late. Many brands are investing large sums of money in the attempt to get the ‘user experience’ right for their products, whether it’s Apple with their iPhone or Samsung with the ‘Smart’ washing machines. Sometimes it works and takes the industry forward; sometimes it doesn’t and just breeds confusion and frustration. It’s these emotions that are at the crux of user experience for many of us and highlights our first real thoughts on the subject. Most of us don’t even consider the experience of using something until it becomes a pain in the arse; we lose interest or learn to just tolerate it until something better comes along.

The emotional response of a user is one of the central factors in creating something that either works or doesn’t. Struggling to navigate around a badly designed app or website is equally as infuriating as trying do your weekly shopping using the trolley with a wonky wheel. It’s a pain to use, you know it could have been repaired or replaced by the supermarket, but still you tolerate it so you can get your shopping done and get home.

Before going further, let’s take a look at a couple of results taken from Google on the definition of User Experience (UX).

  • “User Experience (UX), the overall experience of a person using a product such as a website or computer application, especially in terms of how easy or pleasing it is to use.”
  • “User Experience (UX) involves a person’s behaviours, attitudes, and emotions about using a particular product, system or service. User Experience includes the practical, experiential, affective, meaningful and valuable aspects of human-computer interaction and product ownership.”
  • “User Experience (UX) includes all the users’ emotions, beliefs, preferences, perceptions, physical and psychological responses, behaviours and accomplishments that occur before, during and after use.”

I’m now going to attempt to break down how the emotional response sits at the centre of ‘user experience’ and what we get out of it. I’ll be using a subject close to my heart which doesn’t involve any reference to computers, iPhones, design psychology or any other techie-jargon that tends to baffle and bemuse most of us…myself included.

OK, a little history. Don’t panic, its not a trip down memory lane, just a little foundation work. Way back in the Jurassic period - well early ‘80s - I was the ripe old age of 10 and witnessed my very first Formula 1 race. It was the golden era of great drivers like Gilles Villeneuve, Alain Prost, and Nigel Mansell, and very early on I was hooked. By the beginning of the ‘90s I became, what can only be classed as, obsessed; everything else was scheduled around Formula 1 race weekends, from Saturday qualifying to the Sunday race day.

Now, for as long as I can remember, Formula 1 has always been the pinnacle of automotive genius. No matter how many rules and regulations they have to work within, Formula 1 engineers always manage to get their cars in the pocket so to speak. Many of these technologies eventually filter down into everyday cars used by all of us. Unfortunately, it’s this progressive approach to cutting-edge technology that started this whole problem for me. Who would have thought it would be something as simple as the tone of the exhaust note that had me questioning why I wasn’t enjoying the F1 ‘experience’ anymore?

Before reading on, take a minute and watch the clip below:

This clip perfectly illustrates the essence of my own ‘emotional experience’ within the F1 environment, and for me, as an ageing petrol-head and die-hard Formula 1 fan, what is now missing.

Don’t get me wrong, I’m not wishing that Formula 1 cars were still big V10s and V12s kicking out all sorts of nasty stuff, just so I can still enjoy my complete Formula 1 experience. What I am saying, however, is, for their fans (users), did they miss a trick?

Let’s see…

Staying in similar territory, Harley Davidson has recently been shouting about the ‘Project LiveWire’, their very first, fully electric motorcycle; a massive eco-friendly step for yet another company/brand that is known for big fuel-guzzling monsters (or ‘hogs’, to those in the know).

Picture if you can, the average Harley Davidson rider. Can you see them jumping on this massive beast of a machine, just for it to sound like a Scalextrics car or their mum’s hair dryer? Definitely not. Half the ‘experience’ of straddling a massive hog is to have this thunderous beast at your command, opening it up and hearing it roar; that’s the Harley experience.

image

Harley Davidson gave the ‘user experience’ issue some considerable thought when developing their new fully electric concept motorcycle. It would make no sense whatsoever to develop something as advanced as Project LiveWire and have it sound like the thunderous internal combustion engines of the current Harleys; that was their heritage…this is the future.

Mark-Hans Richer, Senior Vice President and Chief Marketing Officer for Harley Davidson, said, “The sound is a distinct part of the thrill, think fighter jet on an aircraft carrier. Project LiveWire’s unique sound was designed to differentiate it from internal combustion and other electric motorcycles on the market.”

Project LiveWire itself isn’t actually a production-line motorcycle at this stage. It is in fact a fully functional concept project, with the sole aim of generating feedback from riders on their ‘experience’ of riding the first Harley Davidson fully electric motorcycle. The designers and engineers realised early on in their plans that the experience of the rider (user) was the key to getting this motorcycle right. Feedback from its already loyal community and a potential new market of riders would be a valuable step in getting the process right first-time.

Now the question is, could my viewing of a Formula 1 race constitute ‘user experience’ in the same context as riding a motorcycle? I think it does, and it’s for reasons that are not tangible and can’t be explained in diagrams and flowcharts. It’s the emotions generated by the user (in this case me), whether they are good or bad emotions. Unfortunately for most of us, the first time we ever think about user experience is when we have had a bad one.

It’s very easy these days to wax-lyrical about how a good user experience shouldn’t even be noticed…it should just be; and as a direct clinical statement this is fairly accurate. However, I personally feel this is sidestepping the subject slightly. The development and research Harley Davidson are putting into Project LiveWire is a good example of a brand taking the complete ‘user experience’ into consideration, everything from riding position to exhaust tone. This all adds up to a complete experience for the user, both physical and emotional. Whether it’s riding a cutting-edge motorcycle, watching TV or navigating a website, our ‘user experience’ encapsulates everything from our mechanical interaction to our emotional reactions…the good elate and unfortunately more often than not, the bad infuriate.

So in answer to my earlier question, did Formula 1 miss a trick when they made this fantastic leap with technology? Going on my experience, I would have to say yes. Since the beginning of the 2014 Formula 1 season I have tried several times to watch a race and it just doesn’t work for me the way it used to. It’s like listening to Guns ‘N’ Roses without Slash playing the lead guitar. You like the songs and tolerate Axl because he has a great voice, but something is just missing and you can’t put your finger on it…you just know its not there.

An interesting point in closing…

F1 owner and big boss, Bernie Ecclestone, went on record at the beginning of the season saying he was “horrified” at the noise - or lack of it - and was going to push for ways to remedy this. Could you image what it would do for the sport and brand of Formula 1 if cars started to sound like something out of Star Wars as they raced around the track, similar to that of the Harley Davidson Project LiveWire?

From gaming to web development

“With 18% of people in the UK accessing the internet using a game console, it’s time to look beyond desktop, mobile and tablet browsers.”

I was positively surprised to see a Mario Bros introductory slide, when Anna Debenham started her talk at the Web is conference a few weeks back in Cardiff. It wasn't something I expected to see, although - as it later proved - gaming consoles are relevant to web development and we can learn a lot from looking at how they render websites.

image

Anna talked mainly about limitations of console web browsers and limited input and how they impact web browsing in general. We are used to creating websites for touch, mouse and keyboard inputs. Actually, there are more types of input than we realise, for example voice, gesture or using two screens. We also need to consider very small and very large screens.

image

With these in mind, we can design and develop more usable websites, not only for consoles, but for many other devices. As Anna said, by making something better for one device, you might end up improving the experience for many more.

The lines are blurring between what is mobile, tablet and desktop these days” (Cameron Moll). There are device silos (mobile, tablet, desktop), as Anna pointed out. These silos are just wrong in my opinion… We cannot design a website targeted for (i.e. iPhone) users with media queries crafted for specific devices… As soon as a newer device comes out, these might just no longer be the best media queries for that website or device. Also, content might not look its best when we don’t take it into account when selecting our media queries… But I am going off topic now…

What is mobile? Can we define it by the devices people use or where they use them?” Luke Wroblewski. I could not agree more. To me, “mobile” in modern web development means a device that is used on the go, not just a phone. There is this misconception and at first I also found it confusing - many people are used to the term mobile describing a mobile phone. They may not be aware that they also have a “mobile tablet” and a “mobile handheld console”.

no design for screen size = no device independence

I didn’t even write notes about this, as I think it is just self-explanatory… You cannot have device independence, if you do not take into account various screen sizes. When your site is not usable on a mobile phone, for instance, you would be breaking device independence… In Anna’s words… “Don’t dismiss devices just because you don’t use them”

Performance is a user requirement

Jason Grigsby - “We can’t predict future behaviour from a current experience that sucks”. Also, when making choices, we need to consider many things, for example is our beautiful banner image going to use up a lot of the user’s bandwidth? What do you sacrifice instead?

image

It is not just about the size of the websites. A lot of consoles have very limited support for things we take for granted, for example CSS. On some consoles it would mean broken layouts, while others will not render the sites at all. Other devices have very limited or difficult to use input like on-screen QWERTY keyboard. Some handheld devices allow users to extend it onto a TV screen, shifting the experience from a relatively small into a much larger screen.

Finally, some random guidelines for web design/development:

  • Design to standards, not to browsers

  • Test for capabilities, not UA strings, [when detecting browser/device/whatever], many devices have wrong or misleading UA strings.

  • Progressive enhancement - detect features not limitations

  • Test on real devices - not simulators - as simulators aren't often reflecting the real device’s behaviour. Anna’s Game console browsers site for some web based tests and you can compare the results with your own real devices.


If this post was of interest to you, you may want to visit Future Friendly website to read a bit more about building websites in a more future friendly way. You can also watch John Grigsby’s - The Immobile Web on Vimeo.

Need For Speed

Adam and Kamila went to Cardiff, and all they got was a lousy T-Shirt - Plus a few blogs about some of the talks they saw, including this one.

Stat attack! Only 12% of the top 100 retail sites (US) render is less than 3 seconds. Year on year, the average (Median) page load of these sites has slowed down by 23%. This is staggering.

Andy Davies had arrived to share his talk at The Web Is, Day 2. Entitled “The Web Is Too Slow… But We Can Fix That”.

His talk was primarily made to teach us that we need to be deliberate about performance - And he also shared some processes which can help make your websites faster.

Speed, he says, is the second most important thing to users (After clear content/layout). There are almost definitely massive gains for your company to be made in this area - Just look at Staples, who shaved 1 second off the median page load, and gained a 10% increase(!) on conversions. Website performance is big business, whether you’ve noticed yet or not.

image

Interestingly, when Youtube invested in improving their site speed, their average page load time went up, rather than down. The reason for this is really interesting - They were now reaching people they had never reached before. Suddenly, Youtube was viable in rural areas where it had previously been too slow to even use. To them (And hopefully, to you) this is obviously a big deal - A whole new audience!

But the speed of your site isn’t an exact science, and you also cannot definitively say that faster = better - It’s more that your site speed needs to match up with user expectations. While the vast majority of these expecations are for the page to load very rapidly, Andy told us about how Kayak deliberately slow down their comparison price search because people got suspicious when it ran at full speed. The expectation isn’t always for the fastest page imaginable, but really for the page to load in a speed which the user deems ‘satisfactory’ or 'worthwhile’.

The key takeaway here really is that no matter what you do with your performance, you really need to think about this stuff during the project rather than it being an afterthought - It’s too important to do anything else. I’ve never thought of it like this before but when Andy said it, it made so much sense to me: Performance should be considered as a design constraint, from the start, in the design phase, not something you deal with at the end of a project.

image

We should all be setting ourselves per-project targets: X event should happen in Y seconds when under Z network conditions. This target is the yard stick by which you determine whether you’re meeting your goals. With tools like PerfBar and Grunt PerfBudget you can even build these requirements into your workflow, and this is something we’ll be considering at Etch in our next review.

Chrome tracing is an obvious help to the hunt for bad performance, but there are other things you can do on top of this - Simulate bad connections during your testing. Use WebPageTest to run tests and compare your competitors, or use SpeedCurve, or one of the numerous other services - The important part is that you track and monitor it at all times.

Having drilled this message into our brains, Andy shed some light on how internet performance can be attained - He aptly described Critical Path (the process by which your browser turns markup and JS and CSS into something you can actually see), and explained that contrary to popular belief, the internet is not like a pipe.

image

The internet is more like a bucket line, with people passing buckets of water. The round trip time for water to pass along (known as latency) matters more than the mbps someone has.

Andy also shared an interesting cheat I liked a lot - Did you know Instagram visually shows that you have ‘liked’ an image immediately, even before it has actually done all the AJAX posting to actually ‘like’ it? I didn’t, but it’s a piece of simple genius. The slowness of having to wait for an action is negated by cleverly doing it when the user thinks it has already been done.

image

Nearing the end of his talk, Andy criticised font foundries which value their licensing over user experience, and encouraged us not to use them. These foundries use aggressive cache techniques which result in worse performance for your user, so according to Andy should always be shunned in favour of more user friendly alternatives - Not sure I’ll get that one past management, but interesting all the same!

As a finale, Andy told us some of the new and potentially future stuff coming down the pipeline which may help his cause, like the CSS rules of ‘font-timeout’ and ”font-desirability’, plus HTTP 2’s Server Push functionality.

I’m not much of a server admin so the most interesting part of this for me was the CSS rules - A way to designate in CSS how important your font is and a timeout before the CSS tries something else.

All in all this talk was an interesting insight into web performance - One which will have us reviewing our internal practices and workflows to try and improve our own load times.

Ready, set, go.

- Adam

Constantly changing web

Last week Adam and I went to the web is… conference in Cardiff. I would like to share my notes from Nathan Ford who was one of the many speakers.

We are constantly online, the web is constantly changing. We are surrounded by constant changes. In his talk, Nathan Ford tried to answer his own question: “How to design for constant change …and not go mad”.

Nathan compared the web to a monster [more precisely - a cookie monster]… So, this is a summary of what works for Nathan Ford [and his team?].

There are three structures:

  • Team (the resources) - we need to work together. Collaboration is vital.

  • Project (how to run a project, embrace changes)

  • Design (at first - it’s all dark - it is quite hard to define what the design should be)

 

Teams. Quite often teams look like the following:

 image

Make the client the rest of the team. Make the client involved. You can find the “champion”  at the client’s side - it would often be the person you are in touch with… If not, it would be the person in charge of the project, someone who knows a lot about it.

Involve stakeholders - this way they are aware of what is happening throughout the whole life of the project. This means that they will no longer come to see the project in 6 months and want to change everything… you’re protected from blame and the client is happy.

No surprises. No blame…

 

Embedded teams, shown in the image below mean that the client is closer, they are involved at all the stages (especially the “champion”).

image

 

Project management for constant change

There are these wicked problems - problems that are almost impossible to solve/fix. Treat projects like wicked problems.

  • Not done, better (never finished) [not sure what that meant?]

  • If unsure - try everything, try out a lot to see what works

  • If something doesn’t work, don’t force it (reject it), but try to explore an alternative (move on)

  • If it does, explore it further

It is OK to fail, but one must learn as a result. Failure is not the objective, it’s not good, but when it happens, learn from it and move on.

Do the projects the agile way not Agile [“agile” is not scary while “Agile” is].

Work in sprints… Start with sprint 0 - that’s where you bring the client in, involve them from the beginning, gather all the required information, etc. You then keep the client involved at all the stages of the project.

Also a good point was made - doing agile doesn’t mean you cannot adapt it to suit your company’s needs. I agree that we should do what works for us and not follow some rules to the letter.

 

Embedded teams mean that communication is easy - ask the client for feedback (it is easier to do if they are a part of your team).

  • User stories - these should be written by the client not by you - organise workshops to educate the client, for example.

  • Prototype early (as soon as possible) and give the client access - so that they can give you feedback.

  • Use style tiles and let the client know if these change, too. Also, make them aware that they are likely to change in due course; they’re not set in stone.

Sprints structure (doesn’t need to happen in this order, but should contain these elements):

image

The above might not be easy/desirable for you to do, because you will be sharing unfinished work with the client. Still, it is better as they will be more involved from the beginning of the process and can provide feedback early.

 

RWD (responsive web design) process

  • Start with content

  • Work with the constraints (not against them)

  • Use a grid system - define the grid for the given content. There are many grid systems, for example Gridset or font based grid systems. For more information about using gridsets)

Finally, a suggestion for the CSS units which work well for Nathan and what they are used for:

  • Percentages - for most of the things

  • VW, VH - for the headlines (better control over the type size relative to viewport size)

  • PX for media queries

  • Em, ex for type and max-width

Let’s Get Physical

Last week, I got to go to sunny(!?) Cardiff for The Web Is - A celebration of the web’s 25th birthday.

What I wanted to do was to write a big blog post about the whole event - A run down of the key takeaways from each of the talks. However, when I started condensing my notes down, it became abundantly clear that some of the talks were too darn interesting to shrink down to a synopsis. So, I decided to highlight some of them specifically in their own blog posts.

One such talk was Scott Jenson’s talk, entitled “The Web Is Like Water”.

“You must be shapeless, formless, like water. When you pour water in a cup, it becomes the cup. When you pour water in a bottle, it becomes the bottle. When you pour water in a teapot, it becomes the teapot. Water can drip and it can crash. Become like water my friend.”

- Bruce Lee

Scott’s talk was about The Physical Web, and he made a strong case for it. His argument is based on the idea that the Web, he says, is like water - It flows into any cup (device) and fills it. 

So far so good, right? He began by telling us about the dangers of standardising things on the web too early - For example, will we really want ‘pull to refresh’ to be a standard forever? Or will something better come along?

To illustrate his point, he gave us some information about the history of the Steering Wheel. Yes, the steering wheel.

image

It’s worth covering a bit because I thought the underlying truth he was getting at was interesting - When cars first came along they had tillers (Like a boat) instead of the wheel which we now use today. To us, this seems stupid. But they didn’t use tillers because they didn’t have steering wheels - They actually had invented (And hated!) them. It was because the technology wasn’t there yet to make steering wheels viable - Specifically the ability to separate the steering wheel’s movement from the direct alignment of the car wheels (Say, when you hit a pothole - This is called irreversible steering).

In many ways, our industry still has these 'tillers’ - Things which in the future will seem insane, but work better for us right now. And them being the standard isn’t necessarily the right thing, because a steering wheel-esque solution may be just around the corner, if we can develop the right technology to support it.

image

The Web Standards Elitists of the world would have us decide everything now and it be settled, all of us subscribing to the agreed formula for all future time, when in reality it only takes one game changer to make us need to re-think what we should be doing. They would be quite happy using a tiller to drive their cars forever, because it was agreed upon before steering wheels became viable. Take the iPhone as another example - It changed our idea of what web standards should be, and now we have new ones emerging. The idea of hundreds of smart devices living in our world around us is another potential game changer, and the standards we’ve got used to may not necessarily apply again.

From that he moved on to telling us about The Physical Web specifically, which is a fascinating idea about how smart devices should work in the future. Web agency clients often have what Scott calls 'App Myopia’, the desire for an app which is unnecessary, and so far the world of BLE Smart Devices has the same problem. Your smart thermostat has an app, every smart vending machine has it’s own app, smart parking meters empty your wallet with unique custom apps, your local smart bus stop has one too.

The future of interacting with smart devices cannot be app based, because we would have too many apps (Most of them would also be terrible) - Apps for smart devices are a linear solution to an exponential problem because the number of smart devices we have personally is going to explode but the amount of apps we want to have on our phone isn’t.

Instead, we need to develop an open, web-based standard, where smart devices broadcast URLs and the user can interact with them if they’re nearby without any additional apps. This would presumably be built into the operating system, a web browser, or there would be a few apps to choose from to cover this entire purpose (Much like a 'browser’ app covers the web today)

image

Scott told us about the three levels of the physical web:

  • Coordination - The Jetsons-style holy grail where all your devices talk to each other in a 'cascade of awesomeness’
  • Control - You get to control your stuff using the internet. Neat.
  • Discovery - You get information and context from the devices around you. The simplest of the three. 

This physical web needs a sort of 'proximity-based’ DNS for discovery and ranking, which can lead to those interactions.

So what can the Physical Web actually do? How would it work in our everyday lives? When people talk about iBeacons they tend to talk about coupons in a shopping center, but there’s so much more it could do.

The simplest implementation of the physical web is what Scott calls the bus stop model - A user stands at a bus stop, which is broadcasting a URL. The user visits the URL to fetch some information about bus times. Coupons for nearby shops would work in a similar way.

The second (more exciting) implementation is the vending machine model - A user stands near a vending machine, which broadcasts a URL. The user visits the URL to choose some food. So far this is an identical process, but then the website server contacts the vending machine to say “Hey, this guy wants a Mars Bar. Drop it!”.

The third (and sadly kind of impossible - For now!) implementation is that the user connects directly with the smart devices around them using JS-based APIs which do not yet exist, removing the need for the external web service (or The Cloud) powering things from above.

My mind boggles at the possibilities, and with the rise of wearable tech even people walking down the street could be broadcasting themselves (or, the bits of themselves they’re comfortable with) over the Physical Web to people they meet. It’s a lot cooler than a business card, though it has obvious privacy issues to overcome.

image

All of this stuff, exciting as it is (He gave us a free physical web beacon thing! Eeeh!) it’s going to take a long time to get there. Privacy concerns are one massive issue, and there will undoubtedly be others to overcome.

Scott doesn’t see this as an insurmountable problem, and crucially, doesn’t see this as a Google project - It’s for everyone. He argues that there are two types of idea: Truck ideas, and road ideas. The road ideas are infrastructure whereas the trucks are more immediate ideas based on existing infrastructure - Roads take a long time to make, but trucks need them to run on!

In many ways the Physical Web is the long term idea. The idea that a rising tide floats all boats is true here, because this is one idea on which many other ideas will one day exist, from a variety of benefiting companies - But we will have to work on it to get there. So let’s all start digging and laying down tarmac - The road to the future is ready to begin construction.

- Adam

Thoughts from Cardiff

On the 30th and 31st of October, Etch’s front end team (Myself and Kamila) headed over to Cardiff for The Web Is - A conference celebrating 25 years of the world wide web. Two hectic days later we’re exhausted, but we did all that tiring conference malarky so that you don’t have to, because now you can just read this! Here are our favourite takeaways* from our time in Wales. 

*Does not include late night burrito, which was the best takeaway.

The Web Is Knowledge

Adam: 

Chris Murphy gave us an insight into his role as an educator at a university, and one of the things I really liked that he spoke about was this idea of how developing people (In this case, your staff or the workforce of the future) you had to take an agricultural approach instead of a mechanical one - Your dev team isn’t a factory line waiting to be upgraded with new parts or hitting with a hammer, they are a group of organic living things which grow if you nurture them. He also said giving people confidence is a key part of this process which I think really resonates with a lot of people in our industry, given how most of us tend to feel imposter syndrome at some point in our careers!

Kamila:

Chris also talked about how - by working together - we are greater. He called this the lollapalooza effect, that collaborating people should come up with better ideas than just one person. To sum it up, he gave us the following equation: 1 + 1 = 3.

He also mentioned Sir Ken Robinson, who said that “we all have this capacity [to learn]”. Confidence is very important, we need to believe that we can do something, that it is possible. The confidence is to believe that something can be achieved.

The Web Is Constant

Adam: 

What Nathan Ford’s talk should have been called is “The Web Is constant-ly changing”. He told us about his process for accommodating the ever-changing nature of the web with a variety of useful ideas. One thing I really liked was about bringing the client into your team, and learning empathy in both directions - Criticising their ideas (and even their behaviour!) when necessary but being open throughout, and understanding they they will be critiquing you as well!

Another Nathan said which I thought was great was: “Never measure a website by whether it is ‘done’. Measure it by 'is it better?’” - We should all be trying to improve the web experience our client is paying us for, not just ticking the boxes to 'complete’ it. Basing your sprints on valuable user stories, workshopped with your client, can help towards this cause.

Kamila:

See my thoughts on the Web is Constant talk are in the Constantly Changing Web post.

The Web Is Everywhere

Adam:

At face value, Anna Debenham’s talk was about game console browsers. But if that’s all you took from it then you missed the fundamental point - That the Web is everywhere, on an ever increasing number of devices. You need to be thinking about these devices now, and designing resilient, performance-focused websites to accomodate the changing marketplace. Smart TV’s and console browsers are things people actually do use, by the way! She shared some of the difficulties these devices had - Highlighting some very strange behaviour and design choices on the part of some of the console creators.

Kamila:

I absolutely loved this talk, see From gaming to web development for my thoughts.

The Web Is A Great Big Playground

Adam: 

Well, Seb Lee Delisle has the coolest job ever. Nearly everything he showed us involved lasers, and I was blown away by some of his installation work. We really need to get some more lasers down at #hacksoton… Where was I? Oh yeah, one of the biggest takeaways from Seb’s talk was: Finish your projects! If you actually finish them that already puts you way ahead of most people. But remember there’s always someone better than you. Fun talk.

Kamila:

It was quite difficult to take notes during this talk as we were bombarded with lasers! As Adam already mentioned, Seb’s main point was to convince us to learn new stuff and finish your projects! He mentioned that the last 10% of a project takes 90% of the time… And that sometimes it’s just good to build stuff for fun. It seems to have worked for him! See Seb’s website at http://seb.ly/.

The Web Is In The Hands Of 97ers

Adam:

A 97er is someone born after 1997. Apparently they own the internet now, sorry guys! We’ve all got 'til the end of the month to move our stuff out. Emma from Rewired State shared her thoughts on these teens and how they will shape the web in the years to come.

Kamila:

I learned that the web is made of cats, selfies and food, which we all kind of know already… And that WiFi is considered the most basic human need by many people!

But seriously, I've learned that the 97ers grew up with the social media - they have different attitude towards identity and often their online community is what they value a lot. Their attitude towards learning might be slightly different, as they learn peer-to-peer and outside of their class rather than within the classroom.

image

The Web Is All Consuming

Adam: 

So, the internet is kind of a big deal right? And the web consumes so much of everything that it can take control of our lives a bit. Kier told us some of his opinions on this, highlighting the need to keep lines between work and non-work, while still doing something you’re passionate about. To organise himself he makes a daily todo list with one big thing, three medium things and 'some’ small things to complete, rather than looking at his entire list and freaking out! One other thing he mentioned was the idea of not being afraid to take a break - We all have a bit of a fear of missing out, which you need to overcome to truly step away. I take it this means Etch should send me to Hawaii to chill with no internet for a while? 

Kamila:

I could really use this type of a todo list! I can only agree that oftentimes we have too many plates spinning. Kier’s advice was that we just need one area of focus and only work on that one best idea we have (instead of trying to get it all done)… So, in order reduce the “noise” from the all-consuming web monster, we can switch off notifications, subscriptions or unfollow people and things. Or embrace the JOMO, the Joy Of Missing Out.

The Web Is Made Of Links

Adam: 

Yes, it is! Phil Hawksworth waxed lyrical about his love of the link or URL. Did you know that the HTTP:// that proceeds every web URL kind of looks like a 'double meh’ emoticon at the end? Now you do! Some interesting stuff I want to look into more like rel=“prefetch” and the 'Origin Chip’ setting (Currently only in Chrome Canary). One interesting tidbit from this: Google trialed 41 shades of blue to determine which blue they should be using on their links for higher click rates. That’s how they came up with the blue they use today. Neat.

Kamila:

Phil also touched on another issue, which I found interesting. Is hiding the URL from the browser a good or a bad thing? Apparently Chrome Canary does that and I am not convinced it is a good thing, just as much as he wasn’t convinced. Glad it’s only in Canary!

The Web Is A Discussion

Adam:

Mental Health is an important issue which should be discussed. Andy decided to record a live podcast about it with the help of some special guests to chat about the pressures and mental health issues prevalent in our web developery culture.

Kamila:

As it was the Geek Mental Help Week, there was a live discussion about mental health in the industry. http://geekmentalhelp.com/.

The Web Is Like Water

Adam: 

I like this talk so much that I wrote a whole post about it!

Kamila:

Scott Jenson talked about the Physical Web and gave us all away small beacons to play with. They basically work by transmitting a URL that can be accessed on a mobile device without the need to download and install an app (you only need one app in order to use it, but it’s still better than having tens of apps).

The Web Is Still Young

Adam:

Benjamin is 16 years old, and he was talking at a pretty big conference, so well done him! He told us about the challenges of ageism in the industry and about how to get young talent into your team effectively.

Kamila:

A great talk by a young man, who started coding as a kid and he already works within the industry. His main points were to put more trust in young developers, as it’s likely they’re just as capable as older developers, to have more mentoring available i.e. through educational schemes or providing free tickets to conferences to those under 18.

His blog is available at his site.

The Web Is Turning Difficulties Into Opportunities

Adam: 

Robin Christopherson was very inspiring. He’s visually impaired and he told us about how technology had the power to change the lives of people like him for the better. I still need to research this stuff more because it was fascinating, but he told us all about talking goggles (They identify things and say them out loud!), the usefulness of light sensor data, captioning conversations with google glass, emotion recognition in camera apps, facial recognition to spot friends - Or foes, for that matter, navigation for google glass, moto hint, driverless cars and brain controlled robots. The rise of artificial intelligence is going to revolutionise disability interactions, and having seen Robin speak I can’t wait for the future to get here. After all, there are so many people who deserve a real shot at life, and that technology is able to help them get there.

Kamila:

It was a moving talk by a man who is very grateful that the web is for everyone to use. For this man (like so many others) life is normal, only because of the available technology and a number of apps made to improve people’s lives. Getting around the city is no longer a problem when you have a guide dog and an app which reads street names and numbers out loud as you pass them. It is no longer difficult to communicate, because there are apps which can be used to recognise other people’s facial expressions and tell you whether they are happy, sad, surprised etc.

There even is an app that to recognise written text using your phone’s camera and read it out loud. It would translate text from a foreign language into English. Now, a lot of people could make use of this app, not just the visually impaired. Just think about it. Aren’t we all impaired in one way or another compared to other people? Simple translation tool proves that yes, we are. When on holiday in a foreign country we are often “speechless” and “deaf” to what other people say to us, because of the language barrier. Technology enables us to bridge this gap and enables us all to communicate, and in general, to remove the “impairments” every single one of us might have.

Robin demonstrated that he could use his phone and laptop quite well, despite the fact that he could only hear (not see!) what he was doing. At the same time, it also proved that the technology is not yet at the level it should be to fully support visually impaired people. It is a lot easier to get lost and it can take a bit to get back on track, although it was still quite impressive. We just need to remember about catering for screen readers and other assistive technologies when crafting our web experiences.

The Web Is Too Slow, But We Can Fix That

Adam: 

Andy had a lot to say, so I wrote up a whole blog post about it - You can read that here.

The Web Is Our Responsibility

Adam:

I liked one idea from Sally’s talk in particular - That Responsive Web Design isn’t just about screen size, it’s about web experiences which respond to all sorts of things. She mentioned the forthcoming (and intriguing) light-detector based media queries for changing your design based on the light where the user is reading it, as well as media queries to tell us about the presence of scripting, hover, the accuracy and presence of pointing devices. All of that is stuff we can kind of do right now in a custom JavaScript kind of way, but to see it adopted in CSS will be really interesting. I also want to find out more about the increasing ways we can make our websites available offline, because that will certainly be of interest on some projects!

Sally told one story which also resonated with me, which wasn’t particularly web-based but that I thought was really heartwarming… About how the creativity we sometimes wield can improve any experience - She told us about how a company has sprung up which specialises in the re-design of MRI machines to make them more approachable and fun for children in hospital. The idea being that, if it’s painted and designed like a spaceship for example, the child will participate and get the scan they need without it having to be a traumatic, scary medical experience. I think that was a really great idea.

Kamila:

Sally Jenkinson talked about web experiences and how the web is evolving. She mentioned the evolving web standards, like the media queries support for pointing devices or ones that would query the ability to hover.

image

An example of how the hover media query could look like.

She mainly focused on the light level media query. You can access her light detection demo at http://sallyjenkinson.co.uk/blog/2014/05/18/light-level-demo/.

Her advice was to question everything… for example when working on a web project, ask yourself whether or not do you really need to use jQuery. Is it necessary for your project or can you achieve what you need with vanilla JS? Or maybe you don’t even need JS at all?

The Web Is Read/Write

Adam:

Delving into the nuances of the English language with the aplomb of a man who knew his stuff - Owen Gregory gave a lecture about language on the web.

The Web Is Taking Itself Far Too Seriously

Adam:

A man called Mr Bingo regaled us with interesting tales of his work (Including the hilarious Hate Mail) and performed for us a brilliant rap (Yes, hip hop at a Web conference) about the hilarious things you find when browsing stock photography. Funny stuff.

The Web Is Progress

Adam:

Wrapping up an interesting two days, Brad Frost shared his thoughts on what we’d seen so far and about the power of the web when we all do things openly and share. 

What’s design psychology?

Parties are awkward for me—not because I slurp my wine or pepper people with a projectile of vol-au-vent crumbs when I speak—but they’re awkward at the moment when someone asks “what do you do for a living?”

“I’m a designer” is perfectly acceptable, but misleading as I don’t design leaflets, logos or websites – so the follow-up question of “what sort of thing do you design?” makes the conversation unravel.

“Psychologist” would also be passable, but I don’t work in a hospital or deal with people on a one-to-one basis. This answer also, more often than not, elicits the response of people thinking I’m a little weird or that I can read their mind (I can’t).

image

So the only response I have left is “I’m a design psychologist” – much more accurate but you can imagine the blank faces and shuffling of feet in the opposite direction.

Outside of dinner parties the profession of introducing the science of human behaviour into the field of design is nothing new. The advertising industry long ago embraced the power of influencing us through psychological or behaviourist techniques. Indeed John B Watson (who I consider to be the father of modern psychology) entered into a very successful advertising career after having to leave academic life after sex scandals at his college (I bet that’s got you heading off to Wikipedia). In contrast, graphic design has never really felt comfortable with the methods of psychological science, possibly due to the bad feeling that the advertising industry seems to have created.

Advertising may be described as the science of arresting human intelligence long enough to get money from it. – Stephen Leacock (1869 – 1944)

What is the difference between unethical and ethical advertising? Unethical advertising uses falsehoods to deceive the public; ethical advertising uses truth to deceive the public. – Vilhjalmur Stefansson (1879 – 1962), “Discovery”, 1964

During the 1960s, even advertising was backing away from behaviourist techniques – worried about the bad publicity surrounding brain washing, human conditioning and mind control. Stories were abound about underhand techniques to trick people into buying products. The greatest of these purported that a marketing executive superimposed subliminal messages onto a film in a small cinema in New Jersey. The messages told unsuspecting moviegoers to “Eat popcorn” and “Drink more Coke” and led to a rise in sales of around 68%. However, later the perpetrator admitted that he had fabricated the whole story as a marketing stunt (don’t worry, every bit of scientific research carried out on subliminal persuasion has shown that it simply doesn’t work).

The result of this bad feeling against using psychology meant that the design world of the 70s and 80s fundamentally ignored how we act as humans and moved into a phase of creating beauty without effectiveness. Recently, this has been changing and people are now accepting again that better communication happens when you have an insight into human behaviour – and that the insights which can really make a difference to a project’s outcome are often lost by leaping to the design stage too early.

In recent years, new terms such as ‘design thinking’ and ‘behavioural economics’ have entered into corporate lingo, showing how organisations are again recognising the value of understanding human behaviour. This time around the reasoning is more grown-up, not aiming for persuasion of the masses (to buy Coke), but thinking about how people really make decisions and using this as a better lens for creating design that helps people achieve their goals.

We are myopic, sometimes irrational and have all these quirks in our behaviour. — Dan Ariely, Professor of Behavioural Economics at Duke University.

No focus group would suggest that speed signs showing a smiley face or sad face would be more effective than any other type of speeding intervention; no boardroom would assume that showing people’s energy use to each other helps lower electricity usage; and no economic workgroup knows why people fail to join pension plans when it will make them better off. Using behavioural research coming out from some of the world’s greatest universities and applying this to the real world means we will design better product and services – and this is design psychology.

Of course, at a dinner party people have normally wondered off by the time I’ve rambled on for this long. Now where are those vol-au-vents.

Pub? Pub.

Most weeks at Etch HQ, we take a trip to our local Pub over Friday lunchtime.

Some have a casual pint, most have some food - Usually we all have a good time, too.

This week however, a crack team of Etch commandos (Tom, Phil, Mike and myself) headed to Portsmouth bright and early to spend a whole day in the Pub - With a difference.

This was PubHack - The idea being that in teams of four, everyone works on a themed project as an experiment.

And this was serious business - A far cry from the care free attitude of some other hackdays (including our own #hacksoton), because there were trophies and everything. We had heard tales of the mighty designers and app makers who walked these halls, we had heard the challenges of our fellow attendees.

Binge drinking makes the headlines, but PubHack is about binge working - An all day rush to get something to show off in the all important presentations at the end of the day.

No pressure then.

The theme was revealed first thing in the morning - “Awkward Situations”.

We set about coming up with ideas and then moved on to a discussion. Before long, we noticed other people already working, already building and making. The pressure rose and we decided to start on our idea.

Having agreed on a series of short sprints during the day, we hit the end of the first one. Before me, a fake dating website was taking shape. Michael had a concerned look, which was the first sign that we weren’t on the right track… And also a hint of the Facebook API annoyances that were to come.

Perservering a little longer, the conversation finally happened after around 2 and a half hours of work - Were we on the right track? Our idea: An attempt to get socially awkward people to sign up for a dating website which would proceed to mock them on Twitter, seemed like a one note joke. Throwaway.

Back to the drawing board then.

With lunch looming on the horizon (Mmmm. BLT…) we threw away what we had so far and started on our new idea - The game called Awkward Roulette.

The core premise was that you would give it some kind of access to your life - Phone numbers, social networks - And the game would dole out random awkward punishments in a Spin-the-bottle style party game.

image

Myself and Tom tested the idea by playing what you might call a ‘Paper Prototype’ - We span a wheel and enacted the punishments manually on each others behalf. Tom took ownership of my phone and called a girl I hadn’t spoken to since University to tell her that I had been arrested. He escaped my vengeful wrath by landing on the 'Escape’ part of the wheel, and we could both confirm that it was really awkward.

What the game was supposed to be at first, and what it eventually became, are different. Liberated from the stringent demands of a client, we were able to tweak our idea throughout the day on the fly. The focus was always on the MVP - Get it to an acceptable level of functionality, then build on it.

That process made the game simpler and it also made it better, in the long run. By sundown, the game was starting to be quite something. My flashing square boxes had become a circular wheel, and the game was given a visual facelift to match (Hello Lobster font!). Mike had squeezed the Facebook API into doing our bidding, and Phil was putting the finishing touches on the Twilio prank call system.

image

We created a monster.

The presentations began in earnest at 8pm. There was a lot to see, all of it interesting. There was an Oculus Rift games with funny dialog, an offensive joke generator, an awkward conversation helper, awkward situation rankings, apps to help you escape bad dates, and more. They were pretty much all hilarious and well presented.

As with all live demos, ours didn’t go entirely to plan as I fumbled with a microphone in an attempt to get audio out of my phone and into the ears of the audience. Besides that it wasn’t too bad, with Mike demoing a variety of Facebook statuses and photographs that the game could post on his wall.

We settled down, packed up, ate a burger and waited. Mingled with some friends and talked about our favourites.

I certainly didn’t expect to win anything, not in the face of so much strong design work and technical prowess.

Award time came soon enough - Bouncy balls were thrown (Don’t ask, I can’t explain), books were gifted, and trophies claimed. To our total surprise, we walked away with 2 trophies and a third special prize. Among them: Overall winner! 

image

I think I speak for the whole team when I say: Thank you, PubHack! We advocate all hackdays, and we can certainly recommend this one. A great time was had by all, and we’ll definitely be back!

- Adam

image

The Etch team continues to grow

The past few months have seen some exciting developments within the Etch camp.

Back in July we were pleased to announce that Chris Laas was joining the team to head up our new Engage division. Already making his mark, Chris is showing clients the true potential of what their businesses can achieve online, and is helping them attract, engage with, and retain new customers in this rapidly evolving and competitive digital landscape.

This month we are pleased to announce two more new members to ‘Team Etch’…

The first is Matt Bliss, who has worked with Etch in a freelance capacity in the past and liked us all so much he’s joined the team on a full-time basis.

image

A self-confessed geek, Matt started his journey into code at the ripe old age of 12. Using the classic Sinclair ZX81, 16k of RAM and cassette recorder, his obsession with code blossomed and has been with him ever since. With over 20 years’ commercial experience in both front-end and back-end development, and specialising in the Umbraco CMS, Matt’s wealth of knowledge and experience within the industry will be an asset to the team.

If he’s not learning Mandarin (yes, that’s right, Mandarin), Matt can often be seen with either a camera or a good book in his hand.

The second addition to ‘Team Etch’ is Paul Davies. With over 15 years’ experience in the design and advertising industry, Paul joins the Etch team in the unique role of design psychologist and will head up this new division with its focus on behavioural economics and design psychology.

image

Specialising in subjects such as behavioural economics, design psychology, brand and online strategy, digital design, interaction design, game design, and heritage projects, Paul is regularly being asked to speak at events on the use of interactive technologies.

He has also been known to wear a bow-tie from time to time!

Saying Goodbye to Summer…the Etch way

So the nights have already started to get darker and there’s a little bite in the evening air.

However, making the most of the current run of fair weather, everyone at team Etch got together to see Summer out in style with the annual Etch Summer barbecue. The New Forest was once again its home, with good food, good company and a little outdoors shenanigans, team Etch where making the most of the last few days of Summer…cue the Don Henley soundtrack.

After Tom’s disgust at having to use ‘domestic’ charcoal over 'restaurant’ grade (very telling on how serious these South Africans take their barbecues…or rather, should I say, braais) we had fire and that gorgeous Summer smell of meat cooking on open flames emanating throughout the forest.

image

Having had their fill of meat, salad, bread and beer, next up was a game or two of volleyball. Random teams where picked and as always, competitive spirit kicks in and the high spikes and power serve acrobatics increased as the games progressed.

image

Eton mess followed, the perfect recovery food for such an energetic game. After a small rest period, the Frisbee and Garden Jenga made an appearance; along with a little more volleyball and Phil Dye showing his alternate circus career with a Diabolo.

image

Culture was added to the occasion with the kids improvised croquet. Taking golf swings with their mallets in the experimental process to develop extreme-croquet…no car windscreens where harmed.

image

A fantastic team social with friends and family, a great time was had by all.

More images can be found on our Facebook page

The Etch Pub Games is reaching a climactic head

After several weeks of Pool and Darts, the lead switching back and forth between the two teams, it has come down to the Darts final between Chris Laas and Stu Lanham. The winner will give his team the advantage going into the final round…the obligatory ‘Pub Quiz’…

Over the weeks it has once again became apparent that every member of the team has a competitive streak, wanting to do their best and win for their team. However, what also became pretty obvious is that Pool and Darts wasn’t for everyone…

Thoughts from the Etch hivemind, plus entries to our weekly studio #FridayChallenge and experiments from #FreedomFriday

view archive