Inside the Matrix

designSTEIN team
designSTEIN Beijing
4 min readOct 25, 2015

The opening sequence of The Matrix did an excellent job of making computer programming look frightening and foreboding. Either stay away or you’re in trouble.

Let’s challenge that notion today: every creative should learn how to code.

The goal isn’t to change careers, become a programmer and quit your design job. The point is to understand basic code so you can use it from web design to mobile apps, and most importantly of all, communicate intelligently with your developers when working together on a variety of different projects that will undoubtedly include design plus code.

In order to remove the intimidation, we’re providing some clarity about how to get started.

BEGINNER:

If you’re a beginner, we recommend you start with the web basics of HTML & CSS (Hypertext Markup Language & Cascading Style Sheet). All the websites you visit are comprised of HTML & CSS. HTML makes up the essential structure of the site whereas CSS determines the layout and colour.

Best Resources:

The most popular website to learn from is Codeacademy.com that teaches using interactive exercises. There’s also Codeschool.com and Treehouse.com if you want the best of both worlds of video tutorials along with coding exercises.

Our favourite is still A Smarter Way to Learn HTML & CSS by Mark Myers. The instructor has a gift for explaining technical things to nontechnical people. His method of teaching will also give you confidence that you are truly understanding as well as remembering what you learned.

INTERMEDIATE:

If you’re already feeling pretty confident about your skills in HTML & CSS and look forward to making things happen in the browser, jump into JavaScript. JavaScript is a programming language of HTML and the web. It is expected to stick around for the next 10 years, and in a rapidly changing online world, it’s good to know that what you’re learning won’t be obsolete anytime soon.

Heads up, we suggest you don’t ask your cool coding friends what frameworks and libraries you should be learning. They’re liable to end up confusing you with words like Angular JS, Backbone.js, jQuery or try to explain what isomorphic means. Fact is, you don’t need any of that to get started.

Best Resources:

JavaScript also has one of the best learning materials online. Besides Codeacademy.com and Codeschool.com, there’s also CodeCambat.com that teaches you by playing games.

And if you want to quickly start experimenting with JavaScript, check out Codepen.com, jsbin.com, or jsfiddle.com and see some of the cool things others are doing in the JavaScript community. Because we really like Mark Myers teaching style, we’re also going to add A Smarter Way to Learn JavaScript. (Don’t worry, we don’t have an endorsement deal, although we probably should after this post).

Once you have a good foundation, you’ll enjoy researching and trying different frameworks. Our rule of thumb — when it comes to learning different frameworks, try to focus on the functionalities that are necessary for your project and choose the best fit.

JavaScript is really a multi-purpose language not only because you can use it to add animations to your website, it can also be used to create mobile apps to web apps and more.

ADVANCED:

If you’re frequently designing websites in WordPress, we recommend you gain a good understanding of PHP (Hypertext Preprocessor) and MySQL (My Structured Query Language.)

PHP is also a programming language except it doesn’t run on your browser like JavaScript. PHP runs on the web server. When you request a webpage in your browser, the web server accepts the request and converts the PHP script to HTML and then displays it in your browser. PHP is generally used for receiving and putting data to and from the database (usually MySQL). NOTE: Runs on Linux based servers.

Best Resources:

Codeacademy.com, DevelopPHP.com, HomeAndLearn.co.uk, and online video courses at Udemy.com

If websites don’t float your boat, why not dive into the world of native apps. We’re going to risk being controversial and recommend anyone wanting to build native iPhone apps to start learning Swift even if they have no prior knowledge of Objective-C. Apple has made app development simpler, more friendly and better than before with the release of Swift. The new iOS language is easy on the eyes, faster and requires less code.

Best Resources:

There’s many resources available, our favourite is DesignCode.io

If none of the above got you excited about learning how to code, why not get ahead of the game and start creating Apple watch apps. This is our latest craze and we’ve been taking the highly rated Udemy.com course that gets you started building 10 watchOS apps in no time flat.

Learning how to code is going to take up a considerable amount of your time and you may start feeling lonely which is why we recommend joining the active developing community here in Beijing. There’s Meetup groups for HTML5 to Python and everything in between.

And if you’re looking for more resources or have a question, feel free to shoot us a message and we’ll respond within 24 hours.

Ready to get started? Share on your moments and inspire your circle.

Next week, we’re profiling a European painter, who became famous in America, and whose art has been used in design from architecture to fashion and even cakes.

--

--