Talking about building the next interfaces with Machine Learning and AI at hackingui

Yesterday I was proud to be an invited speaker at the HackingUI masterclass where I presented about what Machine Learning and Artificial Intelligence means for us as developers and designers. I will be giving a similar talk tomorrow in Poland in my Code Europe talk.

Speaking at the masterclass

The Masterclass is using Crowdcast to allow for discussions between the moderators and the presenter, for the presenter to show his slides/demos and for people to chat and submit questions. You can see the whole one hour 45 minutes session by signing up to Hacking UI.

Master Class #4: The Soul in The Machine – Developing for Humans

It was exciting to give this presentation and the questions of the audience were interesting which meant that in addition to the topics covered in the talk I also managed to discuss the ethics of learning machines, how having more diverse teams can battle the issue of job loss because of automation and how AI can help combat bullying and antisocial behaviour online.

The materials I covered in the talk:

All in all there is a lot for us to be excited about and I hope I managed to make some people understand that the machine revolution is already happening and our job is it to make it benefit humankind, not work against it.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Working with All Star Code in NYC to empower minorities to get into development

Sometimes it is great to work for a large company that gives you opportunities to do some good. I am currently in New York to run a workshop with All Star Code in our offices. Originally Aaron Gustafson was supposed to also be part of this but he got sick. Instead I am happy to work with Rachel White, Claudius Mbemba and Adina Shanholtz to help All Star Code.

Originally All Star Code approached me to get a bulk order for Surfaces for their students to work with. When I heard that their curriculum was involving Git, Node, Web Development and Debugging in Browsers and the stack was Sublime Text and Chrome Devtools I offered a small change. So now we’ll be teaching the teachers of All Star Code’s next course how to use Visual Studio Code and do all the development and debugging inside that one. My main driver there was that Code is open source and thus the students don’t need to get another license.

If you wonder what All Star Code does you can head over to the Decoded Chats blog, where I interviewed Mahdi Shadkamfarrokhi, their head of curriculum.

If you prefer to have an audio version, you can download it here (MP3, 18MB)

Here are the questions I asked:

  1. You work for All Star Code. Can you give us a quick introduction what that is and what you do? (00:13)
  2. How low are the numbers of developers that came from a minority background? What are the main reasons? (01:40)
  3. Do you think that by teaching communication skills together with technological skills you become more interesting for someone with a less privileged background? Is selling technology skills as a part of a whole package more successful? (02:49)
  4. The program has been running for quite a while. Is there a success story you are really proud of? (04:20)
  5. You learn a lot by teaching as you can’t fake it – you have to know. Do you find that it is easier to keep your skills up-to-date by running this program? (04:46)
  6. What are the biggest barriers for your students to get into development? Is it hardware access? Connectivity? The style and language of documentation out there? (06:14)
  7. I learned a lot because when I started computers didn’t do much and you had to program. Do you think that nowadays kids are less inclined to learn as computers are more seen as a consumption device? (07:47)
  8. There is a vast amount of online courses to choose from when it comes to learning how to program. Many of them decayed a bit after the first round of funding dried out. How do you find great and trustworthy resources? (10:10)
  9. A lot of creativity happens on the web but these makers don’t know or don’t get into professional development. Where do you go to find people for your course? (12:04)
  10. Do you see Open Source and services like GitHub to host, document and discuss your projects as an opportunity for newcomers? (14:49)
  11. How can people help you? Are there ways to volunteer? (18:07)

I’m very excited to be working on this.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Internet Privacy Rules: Why should Web professionals care?

The U.S. Congress repealed the FCC broadband/ Internet privacy rules established in the latter days of the Obama administration in late March, 2017. President Trump signed this repeal on April 3. Untouched, those rules would have gone into effect later this year. Those rules were an outgrowth of the Federal Communication Commission’s battle to protect net neutrality. You may be asking yourself – why does this matter, what will this change, and how will you and your clients be affected.

What you need to know:

  • Although most Internet Service Providers (ISPs) have said nothing has changed, they are free to change their policies at any time going forward. Consumers will not have a choice (to opt-in or opt-out).
  • It will be much easier for ISPs (think AT&T, Verizon, Comcast and similar corporations) to track your specific browsing history across all devices.
  • If an ISP decides to intercept search requests, they could send results from their own marketing databases (instead of the results someone might expect).
  • There is also a risk that such “injection” could be hijacked or compromised by malicious individuals. These large databases of consumer information would also be prime targets for hackers.
  • Previously, if you didn’t like the amount of data collected by a corporation (for example, Facebook), you could simply choose not to use their services and select some competitor. That will no longer be an option since your ISP will be the one tracking all your access (potentially).
  • There will not be any filters regarding your browsing history and how it can be used. You will have very limited control over what is shared with others (or sold).

Why this is important

In a nutshell, this is game changer (particularly in the U.S.). Up to this point, individual sites collected data (and used it to target ads). As a general rule, if a service appears free on the WWW, you are likely paying for it with your personal data. Facebook would be an excellent example of this. Using this company an example, Facebook wants you to visit Facebook so they can mine the data you share and can then sell targeted ads. These sorts of ads are likely to generate more revenue for the advertiser. That being said, each company wants to keep the data they collect about you to themselves. Frankly, information equals power these days. The more a company knows about you (and your browsing habits and searches), the better they can target ads.

That being said, there are limits. Most of us have smartphones, tablets, laptops and other devices. Trying to identify the common visitor across all these devices is a lot easier when the Internet Service Provider can be involved. One can no longer opt out by choosing an alternative company (perhaps DuckDuckGo instead of Google or Bing for Internet searches, for example).

Those of us who have been alive much longer than the WWW understand that limits were set in place for other technologies. For example, phone companies could not collect specific information that you were calling a physician or attorney and then target you with ads for similar types of services. The previous rules likened much Internet traffic to be similar to telephone traffic (and under the same guidelines).

Who voted for and against

Here are the details (who voted for and against this bill in the House of Representatives). For the senate version, votes followed party lines. We also found this overview of how we got to this point informative.

You will have less control of how your online history is used

With the elimination of these Internet Privacy rules, more of your online history will be available to more companies and you will have less control over how it is used. In addition to now being able to collect vast amounts of information from their customers, each company can use said information to provide targeted ads or can sell the collected data to others. Each company is free to change their policies at any time. That is why this is such an important change.

We found this NPR article to provide a solid overview of the situation and what your options are.

Help your customers understand these changes

Undoubtedly, some of your customers will have questions. More sophisticated customers will have detailed questions. At a minimum, we recommend mentioning these main points:

  • Internet Service Providers are able to change their policies at will. There is now much less oversight by the FCC and FTC.
  • It is likely there will be more tracking/ recording of your browser history and this data may be used for more targeted advertising. Much more data is likely to be collected (and shared or sold). As a consumer, you will likely not have the option to either opt-in or opt-out of such data collection. Many do not have the luxury of being able to easily select another ISP.
  • For additional information, you may wish to review this FAQ regarding what happens as these rules are cancelled.

For those who wish to pursue more privacy, here are some of the things you can do today:

  • Download and use the HTTPS everywhere extension for Firefox, Chrome, and Opera
  • Consider employing a tool like Privacy Badger to block spies and hidden trackers on sites you visit
  • Consider using a VPN
  • Consider using Tor as your browser
  • You might also want to introduce some Internet noise (a tool which loads random sites so your actual searches are obscured by large amounts of nonsense searches). This latter tool certainly will not protect your privacy; it will only generate additional “noise” which will obscure your actual search interests among a larger amount of random searches.

The bottom line is that there will be more data available for marketers. While this may be a plus for Web marketers, this is a giant step backwards for privacy advocates.

This has the potential to allow much more focused ads as big data and predictive analytics are brought to bear on an ever increasing amount of consumer information. If one is in marketing, they need to remain aware of consumer concerns.

Practicing web professionals should leverage this change as an opportunity to inform and educate their customers/ clients regarding what may be collected and how best to deal with this new reality (perhaps recommending using a VPN and plugins like those mentioned above).

The Electronic Frontier Foundation recently posted a list of ISPs that respect your privacy. They also provided a solid overview of how to protect your privacy from your ISP. This article also included a number of questions to ask about any VPN (before you purchase). Examples include:

  • How long has the VPN been in business?
  • Does the VPN log your traffic?
  • Is the traffic encrypted? Is there a single shared password for all encryption?
  • Would the VPN leak your DNS queries to your ISP?
  • Does the VPN support IPv6?

We anticipate that this is only the beginning of the discussion regarding increased awareness of privacy issues on the part of consumers and professionals alike.

Best always,

Mark DuBois

Community Evangelist and Executive Director

The post Internet Privacy Rules: Why should Web professionals care? appeared first on Web Professionals.

View full post on Web Professional Minute

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

HTML5 canvas cheatsheet

Our colleague, Colin Cieloha, American author and content marketer at recommended the HTML5 canvas cheatsheet developed by his company (and embedded below).

Colin Cieloha

Colin writes about everything that will draw his attention with a focus on the mobile and e-commerce space.  When he is not writing he is spending his time traveling the globe and snowboarding.  You can follow him on his Twitter at @ColinCieloha or on Linkedin. We asked Colin a number of questions about this resource. Details are below.

Become a Canvas Master with this HTML5 Cheat Sheet by has released a new cheat sheet that enables new and experienced web developers alike to create original illustrations and animations. With the use of HTML5 advanced technology, coding enthusiasts of all experience levels are able to read and use this cheat sheet to create impressive designs. Canvas can also respond to all the usual JavaScript events, like clicking and keyboard commands and button clicks, so it’s even easier to use. Here we will explore the benefits of using the Canvas cheat sheet and how Canvas holds up against traditional Camel Case. It’s sure to save you time, effort, and headache.

Why is it important for web professionals to know/ use this cheat sheet?

It saves time! Instead of having to remember all the coding or search for individual codes, an HTML cheat sheet provides all of the most used codes in one easy place. There’s a lot to be said for having all of that extra effort minimized, the common codes are just a click of your bookmarks away. This is convenient for those freelance designers that are in a time crunch as this allows them to complete their work faster and reach deadlines.

Why should they be focused on canvas now?

Canvas technology is amazing because it’s super easy to use. For example, Canvas can draw colorful text to help your message pop on the screen – and you can even animate it! HTML <canvas> objects can move, too, whether it’s just a few bouncing balls or an intricate animation that tells a story. For designers interested in gaming software, the <canvas> element is a brilliant choice for building characters, worlds, and then setting it all into motion.

Canvas isn’t magic (close, but not magic). You’ll still need a basic understanding of HTML and JavaScript to make these codes work for you the way you want, but the <canvas> element is simple and easy to use. The HTML <canvas> element’s purpose is to create graphics, according to lines of script, but it’s only a container. The <canvas> element draws paths, boxes, circles, text, and helps you to create images. It also provides the user with graphs and charts to order their graphic data designs. To draw graphics, Canvas uses a JavaScript context object, which makes it easy and fast to create graphics in your design.

The <canvas> element runs into some trouble with older browsers, however, and may not be supported. Canvas is, however, supported in all recent versions of all major browsers, so as long as your browser is updated, Canvas should work just fine. Canvas’s default size is three hundred pixels by one hundred and fifty pixels, width and height respectively, but is customizable. You can adjust the size of the canvas by using the HTML height and width property in the program.

With Canvas, function names are short and easy to recognize, unlike functions written in CamelCase. Identifiers in CamelCase often require lowercase where it would be more convenient to use all caps. For example, acronyms. It’s much easier to identify a function, if acronyms like HTML or SQL are written in full capitalization, but CamelCase sometimes negates this convenience.

This causes a serious headache for designers when two acronyms need to be side by side in a line of script: “parse DBM XML” would become “parseDBMXML” or when the function starts with an acronym, like “SQL server” (which the designer would be forced to convert to “sQLServer”). Even if a programmer considers acronyms lower case words and writes “oldHtmlFile”, “parseDbmXml” or “sqlServer”, it causes a mess because it makes it difficult to discern if it an acronym or not. Best case scenario, the designer wastes time.  The worst case scenario, they make a mistake and now must comb through complicated lines of script to amend the problem.


Hopefully this sheds light on the massive benefits of the Canvas cheat sheet. Using this cheat sheet will save you time and help you to become a more efficient programmer, web designer, or even help you gain more solid experience as a beginner in this field. I encourage you to go check out‘s Canvas cheat sheet below and begin to create using their helpful, easy to read codes. Have fun creating and I hope this saves you more time!

The post HTML5 canvas cheatsheet appeared first on Web Professionals.

View full post on Web Professional Minute

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Want to learn more about using the command line? Remy helps!

This is an unashamed plug for Remy Sharp’s terminal training course command line for non–techies. Go over there and have a look at what he’s lined up for a very affordable price. In a series of videos he explains all the ins and outs of the terminal and its commands that can make you much more effective in your day-to-day job.

Working the command line ebook

I’ve read the ebook of the same course and have to say that I learned quite a few things but – more importantly – remembered a lot I had forgotten. By using the findings over and over a lot has become muscle memory, but it is tough to explain what I am doing. Remy did a great job making the dark command line magic more understandable and less daunting. Here is what the course covers:

Course material

“Just open the terminal”

  • Just open the terminal (03:22)
  • Why use a terminal? (03:23)
  • Navigating directories (07:71)
  • Navigation shortcuts (01:06)

Install all the things

  • Running applications (05:47)
  • brew install fun (07:46)
  • gem install (06:32)
  • npm install—global (09:44)
  • Which is best? (02:13)

Tools of the Terminal Trade

  • Connecting programs (08:25)
  • echo & cat (01:34)
  • grep “searching” (06:22)
  • head tail less (10:24)
  • sort | uniq (07:58)

How (not) to shoot yourself in the foot

  • Delete all the things (07:42)
  • Super user does…sudo (07:50)
  • Permissions: mode & owner (11:16)
  • Kill kill kill! (12:21)
  • Health checking (12:54)

Making the shell your own

  • Owning your terminal (09:19)
  • Fish ~> (10:18)
  • Themes (01:51)
  • zsh (zed shell) (10:11)
  • zsh plugins: z st… (08:26)
  • Aliases (05:43)
  • Alias++ → functions (08:15)

Furthering your command line

  • Piping workflow (08:14)
  • Setting environment values (03:04)
  • Default environment variable values (01:46)
  • Terminal editors (06:41)
  • wget and cURL (09:53)
  • ngrok for tunnelling (06:38)
  • json command for data massage (07:51)
  • awk for splitting output into columns (04:11)
  • xargs (for when pipes won’t do) (02:15)
  • …fun bonus-bonus video (04:13)

I am not getting anything for this, except for making sure that someone as lovely and dedicated as Remy may reach more people with his materials. So, take a peek.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

JavaScript is not the enemy – my talk at Halfstackconf

In November last year I got asked to give a talk about the state of the JavaScript community at Halfstackconf in London. Now you can watch the recording the talk at opbeat.

I really enjoyed giving this talk as I think we’re taking ourselves far too serious and we overestimate the importance of the languages that we use. Instead of building a high pressure environment of blind innovation we should be more like the language we use. JavaScript is a mess, but it was a very accessible mess in terms of getting people to start working with it. PHP has the same issues and as much as we can joke about its inconsistencies, it powers easily half the web servers we use. JavaScript has a lot of nuances and use cases and each of them come with different best practices. They also come with different experiences and sometimes learning means doing things wrong first and understanding that what you did was wrong later.

There is too much dogma in our little world. The people who love JavaScript tend to overarchitect solutions or create very strict syntax rules. This can frustrate people who think differently and cause lots of unnecessary discussion. Even worse, it can discourage people who want to start using JavaScript as they are overwhelmed by these demands. People who don’t like JavaScript have a tendency to either dismiss it as not professional or as a problem for end users as any mistake of the developer would result in a non-working interface. All of these people have the right to their ideas and are technically correct. But that doesn’t help us as a community.

There is an overuse of JavaScript right now. Far too many products rely on it and far too many developers use a lot of libraries and modules to create pretty simple interfaces. We need to own the use of JavaScript and we need to understand that people of all knowledge levels and with vastly varying approaches are using the language now. This is not a time for dogma, this is a time for education by helping people reach their goals quickly. I’d love to see JavaScript be the language that makes people enjoy creating and learning a new skill. Not a battleground of hardened principles and wishful thinking of what the language should be. We need more diversity and we can get it by making what we do accessible to people of all kinds of backgrounds. Nobody should be feeling stupid for trying to use JavaScript. It isn’t rocket science.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Important talks: Sacha Judd’s “How the tech sector could move in One Direction”

I just watched a very important talk from last year’s Beyond Tellerand conference in Berlin. Sacha Judd (@szechuan) delivered her How the tech sector could move in One Direction at this conference and Webstock in New Zealand a few days ago. It is a great example of how a talk can be insightful, exciting and challenge your biases at the same time.

You can watch the video, read the transcript and get the slides.

I’ve had this talk on my “to watch” list for a long time and the reason is simple: I couldn’t give a toss about One Direction. I was – like many others – of the impression that boy bands like them are the spawn of commercial satan (well, Simon Cowell, to a large degree) and everything that is wrong with music as an industry and media spectacle.

And that’s the great thing about this talk: it challenged my biases and it showed me that by dismissing something not for me I also discard a lot of opportunity.

This isn’t a talk about One Direction. It is a talk about how excitement for a certain topic gets people to be creative, communicate and do things together. That their tastes and hysteria aren’t ours and can be off-putting isn’t important. What is important is that people are driven to create. And it is important to analyse the results and find ways to nurture this excitement. It is important to possibly channel it into ways how these fans can turn the skills they learned into a professional career.

This is an extension to something various people (including me) kept talking about for quite a while. It is not about technical excellence. It is about the drive to create and learn. Our market changes constantly. This is not our parent’s 50ies generation where you get a job for life and you die soon after retirement, having honed and used one skill for your whole lifetime. We need to roll with the punches and changes in our markets. We need to prepare to be more human as the more technical we are, the easier we are to be replaced my machines.

When Mark Surman of Mozilla compared the early days of the web to his past in the punk subculture creating fanzines by hand it resonated with me. As this is what I did, too.

When someone talks about fanpages on tumblr about One Direction, it didn’t speak to me at all. And that’s a mistake. The web has moved from a technical subculture flourishing under an overly inflated money gamble (ecommerce, VC culture) to being a given. Young people don’t find the web. They are always connected and happy to try and discard new technology like they would fashion items.

But young people care about things, too. And they find ways to tinker with them. When a fan of One Direction gets taught by friends how to change CSS to make their Tumblr look different or use browser extensions to add functionality to the products they use to create content we have a magical opportunity.

Our job as people in the know is to ensure that the companies running creation tools don’t leave these users in the lurch when the VC overlords tell them to pivot. Our job is to make sure that they can become more than products to sell on to advertisers. Our job is to keep an open mind and see how people use the media we helped create. Our job is to go there and show opportunities, not to only advertise on hackernews. Our job is to harvest these creative movements to turn them into to the next generation of carers of the web.

I want to thank Sacha for this talk. There is a lot of great information in there and I don’t want to give it all away. Just watch it.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

5 tips for web designers to improve their skills

This article was written by Junaid Ali Qureshi. He is a digital marketing specialist who has helped several businesses gain traffic, outperform competition and generate profitable leads. His current ventures include Elephantation, eLabelz, Smart, Progos Tech and eCig.


Learning web design techniques and tricks is easy. No matter whether you have the right skills or not in the start; by repeating and learning from the mistakes and polishing the weak areas you can easily step up a notch and fall among the highly experienced and professional web designers. The problem that many web design experts encounter here is the challenge to keep up their good reputation and to improve the skills they already have.

Do you have a lot of projects lined up? Every professional web designer does. The real question is whether you have different, innovative ideas for each of them or not? Wouldn’t using the same web design techniques on each project make your style monotonous? This is something every design expert worries about. To help you get through this transitional phase with ease; we have compiled 5 essential tips that help to rejuvenate the web design skills of every expert.

There are several tutorials and videos through which you can learn how to advance your web design skills level; but, every designer needs some instant tips as well. These tips help them achieve goals earlier than expected. One thing is assured; these tips are no shortcut to success but merely the best techniques used by experts worldwide.

The 5 tips that will help you improve your skills are as follows:

  1. Always sketch a rough design of your web before working with the tools. Have you ever seen an architect work? He lays down all the plans on a sheet of paper, reviews them, goes through them again and again, gets the approval of the client and only then proceeds to the next step. The number one tip here to improve your skills is to adopt the routine of making a rough draft of the website you are planning to develop. Once you have made a rough sketch, you can make changes if needed or move towards developing the final website. If you aren’t comfortable with the pen and paper idea, you can use various prototype building websites and apps to get a view of the rough version of the website.
  2. Stay in touch with the latest style guides. Make sure you have your own style guide or you follow a well-written style guide to design the web page. This will help you build the website in a uniform fashion. Keeping in view the template of the website and the effect you would like to add or not; you can either improvise the pre-written style guide or make a new one. Try to make an exquisite design that differentiates you from the other competitors in the market. Large font size is in fashion these days. Try to use it in your template and make some space for typography as well.
  3. Upgrade, expand and re-evaluate your web tools. Web design is not simple at all. You have to use several tools to achieve the effect you are trying to present. It requires using old as well as new tools to bring an innovative idea into a real form. Tip number three states that you need to upgrade your web tools. Make sure you are using the latest version of the web tool and get its updates on regular basis. Add more tools to your toolkit and experiment with new ideas. Only then you can bring versatility to your work. Our company offers new tools and features every now and then. It is the job of the web designer to incorporate them properly into the website using their skills to gain maximum benefits.
  4. Keep your SEO knowledge up-to-date. We have seen that this tip has been repeatedly offered to the readers on different platforms but the truth is, no matter how much we try to escape it, SEO rules and regulations are the standards that every website has to meet. Thus, strengthen your grip over the SEO guidelines. Use SEO optimized keywords, headings style, high-quality content and other linking features to stay in the game. Practice merging SEO techniques in your work project to revamp your skills to a better scale.
  5. Pick catchy and original images for your web page. A web page is defined by the images, content and its style. You need to make it perfect to get a better ranking and to impress the clients. Many web designers use free Google images that are available (but that’s old news now). You need to go for the options other than this to improve your skills.  Try investing in premium stock images or create an image from scratch appropriate tools. You can also capture high-quality photographs and combine them with your own sketches as well.

As web designers, we are already familiar with all these tips. However, it is always good to review these basics periodically. Make sure you follow them and you’ll see positive results within no time!

The post 5 tips for web designers to improve their skills appeared first on Web Professionals.

View full post on Web Professional Minute

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

My closing keynote of the Tweakers DevSummit – slides and resources

Yesterday I gave the closing keynote of the Tweakers Developer Summit in Utrecht, The Netherlands. The conference topic was “Webdevelopment – Coding the Universe” and the organisers asked me to give a talk about Machine Learning and what it means for developers in the nearer future. So I took out my crystal ball 🔮 and whipped up the following talk:

Here are the resources covered in the talk:

Yes, this was a lot – maybe too much – for one talk, but the feedback I got was all very positive, so I am hoping for the video to come out soon.

View full post on Christian Heilmann

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)