Main content

A little coding can take you a long way

Onwah Tsang

Former technical project manager, BBC Academy

A recent BBC Academy podcast struck a chord with me as it discussed how journalists are using code and why knowing how to write a line or two of the language that powers the internet can open up new opportunities for them.

The discussion resonated with an idea I’ve long held - that whilst many of us are specialists in a particular field, there’s huge value to be gained by broadening the scope of your expertise into areas that are complementary to your specialism. My experience is principally in leading teams, but whilst I would never claim to be a developer or engineer, my ability to code up to a certain point allows me to express ideas in a way that can’t be done with written text or static diagrams.

But writing code is difficult, isn’t it? Especially if you didn’t enjoy maths and you were never interested in what all the buttons on your Casio calculator were for. There must be a reason why Google is hiring PhDs out of Cambridge and clever startups can build machines that beat humans at board games.

Guess what? Writing code is actually easy. Anyone with a computer can do it. You don’t need specialist tools or a computer lab. Just the web browser you’re using right now and a text editor.

Let me demonstrate:

Open up a plain text editor like Notepad (on Windows) or TextEdit (on Mac, make sure you switch the formatting mode to plain text from the menu bar):

Type or copy and paste the following:

<h1>Hello World!</h1>

<p>I am writing code for the first time </p>

Name the file index.html and save it to your desktop. Now open it in your web browser of choice and you should see this:

And that’s all there is to creating your first web page. The code you’ve used has told the browser to display some words as a heading for the page (wrapped in the <h1> tags) and some body text (wrapped in the <p> tags).

There are about 100 of these tags serving different purposes and all are well documented and illustrated with examples across the web.

Empowering product teams with code

An architect delicately crafts a scale model showing a building fitting with its surroundings, giving viewers an appreciation for its shape and structure. A car manufacturer moulds life-sized models out of clay so that “everyone can get around it, brainstorming three-dimensionally”. Applying the same principle, digital product teams can mould their ideas using code, bringing them to life.

The aim isn’t for any of the code to make it into the finished product. It’s the ability to express ideas beyond words and pictures that can facilitate meaningful discussions to help a team evolve concepts quickly and efficiently. The creative folks at the design agency IDEO expressed this thought in this saying: “if a picture is worth a thousand words, a prototype is worth a thousand meetings”.

I’ve worked with designers, UX (user experience) specialists and business analysts who didn’t know code but quickly realised the benefits of it when I showed them how. By teaching them these new tools and techniques, they’re empowered to articulate their ideas in a way that wasn’t previously possible. The video below shows how quick and easy it was for me to apply some coding knowledge to prototype a design idea on the BBC iPlayer website without having prior knowledge of how the website was put together. The - fictitious - goal was to extend the branding element of each BBC channel to the video play control on the programme page. (And of course none of my changes could affect iPlayer itself.)

(Video has no sound.)

All this can be done without needing to ask permission from IT, buying specialist tools or getting access to development environments.

When test teams understand the principles of how websites work, they are empowered to go beyond identifying issues to pinpoint the root cause of problems.

For instance, understanding the code behind a web page can help a tester identify accessibility improvements such as missing description information on images or understanding why a button is not linked to a correct page.

Below, the media player on the BBC website is missing its placeholder image:

A tester would identify this issue and log it. But if they were to investigate the root cause, they would find that the reason the image doesn’t display is because the link to the image can’t be found:

A tester who understands the structure and make up of a web page can dig a little deeper and save precious time, here routing the problem to the right team to resolve it.

Coding for empathy

Developing empathy for the roles that are involved in building a product will help you to succeed as a team. I often see friction caused by people being unable to put themselves in the other person’s shoes and to see things from their perspective.

This is a common thread across product teams. Often conflict breaks out between those that design, those that build and those that manage. Empathy will give you a better appreciation for how to approach a situation. It won’t solve all your problems but it will help to bridge the gap between differing views.

The barrier to entry for coding has never been lower

We all learn in different ways. The beauty of the web is that there is such a diverse range of content and learning materials that if one approach doesn’t work for you, there’s an infinite number of alternatives.

The technology community shares what it does and how it does it quite openly and often for free. So events and conferences are a great resource. While you can often stream recorded events, there’s nothing like talking to others who are on a similar journey. Try attending some after-work events and you’ll be surprised at who you meet and what you learn.

Putting your knowledge into practice one bit at a time reinforces your learning and development of a new skill. You don’t need to wait for the next big opportunity, it doesn’t even have to be something you do at work. Commit some of your free time to practicing your new skill and make something.

 

BBC Academy podcast: Coding: The next step for journalists?

Also by Onwah Tsang: Testing the unknown unknowns

 

 

 

More Posts

Next

Seven tips for editing smartphone footage