Categories
innovation technology

GTP3 – Will AI replace programmers?

Huge thank you to those who checked out my last video, I was taken aback by the reaction and it was awesome to interact with so many people from around the world.

Reactions tended to break down into two categories.

  • This is so cool
  • OMG – my job! Will AI replace programmers?

I want to show some additional GPT3 demos and I also explain some of the different types of AI, machine learning, and how it’s amazing and cool but you don’t have to worry about your job, at least not YET! We do however need to worry about AI having bias and being racist, sexist, and more.

Let’s start with some recent highlights…

A context aware dictionary that knows the definition of a word based on the context.
An example of image recognition paired with GPT3 to show good and bad ingredients in a product.

An example of using GPT3 as a function within a spreadsheet.
An example of CSS and layout generation using GPT3
https://thoughts.sushant-kumar.com/. An example of a quote generator based on GPT3
An example of UI generation within Figma using GPT3
An example of using GPT3 to write SQL queries

These demos are amazing progress but in order to unsertand why programmer jobs aren’t in gepordy you need to understand the basics of AI. There are four categories to consider:

  • 1. Reactive machines – Big Blue / Chess-playing – they look at the environment and react.
  • 2. Machines with memory – These are AI’s that can remember things over time and learn from their environment. Self-driving cars are an example of this.
  • 3. Theory of mind – This is when a machine can think and understand that others can think. It can put itself in the shoes of someone else and serve basic needs and functions in a general way. This is called Artificial General Intelligence
  • 4. Self-aware – This is when a machine can has the abilities of the previous categories and can also understand it’s own existance. This is in the realm of science fiction and both categories #3 & 4 are theoretical areas of research and we’re not close to these yet.

GPT3 is mostly #1. While it has a lot of data it’s not designed to remember things from session to session. The model is pre-trained, that’s the PT in GPT and you can think of it as the world’s most sophisticated auto-complete. Similar to how when you start typing and Google completes the sentence. GPT is able to complete questions, code, html files, and more. Because it’s trained on so much data the auto-complete has context but not memory. It’s incredibly good but it’s not perfect and it isn’t tested as valid.

Most of the time the output of GPT3 will be a starting point, not the final product. In the examples above the HTML, SQL, CSS, and text that is produced is most likely to be a starting point but its quality and fidelity, while impressive is unlikely to be a final result.

As I said GPT3 is an amazing piece of technology and I can understand why people may worry about their job. Technology can cause this concern and it’s been going on since Aristotle and Ancient Greeks. Farmers have worried about tractors. Scribes worried about the printing press and mathematicians and typists worried about computers. There’s a term for this is Technological unemployment.

While technology can eliminate or shift jobs it also tends to create new jobs and new opportunities. Even if GPT3 is really good, the world will still need engineers, designers, poets, and creators, perhaps more than ever.

The problem with AI

I tend to be an optimist but there are areas that still need a lot of work when it comes to AI and in particular, bias tends to be a real problem.

Here Chukwuemeka shows an image recognition that isn’t trained with diversity in mind…

This is why diversity in technology is so important and it’s also why we need to be careful about the data that’s driving and powering the worlds most powerful autocomplete. AI tends to work off of large collections of data. This can be imaging data, text data. If we’re not careful about the input data and testing it can produce problems.

In another study out of MIT Joy Buolamwini explores the notion of algorithmic bias and how it can be a huge problem.

Joy has a great TedX talk on this topic if you want to learn more.

As developers start incorporating GPT3 into their products and technologies, it’s important that they consider all sorts of biases that may be in the data.

Bad jokes, offensive ideas, historical inaccuracies, propaganda, sexism, racism, and more. In the billions of tokens that GPT3 has processed, it’s gotten good at auto-completing many things including some that we may offensive, inaccurate, or even dangerous.

Sam Altman – one of the founders of OpenAI touched on this recently in response to Jerome Pesenti, the head of AI at Facebook:

It’s great that OpenAI is taking bias seriously and it’s important that engineers building and incorporating AI into their products consider how their training data may have biases.

Thank you to everyone who watched my last video and checked out this post. I’m incredibly grateful to you for your feedback and comments. If you’re new to the blog, I tend to talk about entrepreneurship, technology, design, so if you like that sort of thing you can sign-up to get updates when I post. You can also subscribe on YouTube if you prefer.

Categories
technology

Floating “Sticky” video Player in WordPress

It’s important for entrepreneurs to understand technology, and at least the basics of how it works. In that spirit, I dusted off my Javascript skills because I wanted to modify my blog so that a video player would stay with the viewer as they were reading an article.

I dropped this sample video here so you can see how this works:

Sample Video

I’m using WordPress as my blog and it has some plug-ins that do this but they are large, bloated, and complex. They end-up bringing in all sorts of added Javascript and CSS that I didn’t like. I like WordPress in general but the platform can get bloated making even the simple-out of the box pages very heavy-weight in terms of bandwidth, performance, and complexity.

I ended up making a simple solution myself that anyone can add to their WordPress site without needing to add a plug-in while keeping the code edits pretty simple.

The Javascript can be added to the page loading functions. This is typically done by adding it to the theme header.

// WordPress has an outter div and an inner one that then contains the iframe
// We move the inner frame while keeping the outter frame.
var youtubeDiv;
var video1;
var video2;
function initSizes() {
  youtubeDiv = document.getElementsByClassName('wp-block-embed-youtube')[0];   //fetch first video iframe
  video1 = document.getElementsByClassName('wp-block-embed__wrapper')[0];      //fetch inner video
  video2 = document.getElementsByClassName('wp-block-embed__wrapper')[1];     //fetch the second video on the page, if there is one
}

window.onscroll = function() {
  if (!youtubeDiv) {
     initSizes();
  } else {  // putting the init function in the scroll event allows us to drop this script anywhere on the page
  if (window.scrollY > (video1.offsetHeight + youtubeDiv.offsetTop)) {
      video1.classList.add('stuck');
      if (video2 &amp;&amp; (video2.offsetTop < (window.scrollY + window.innerHeight))){   //if there are two videos on the page and we're scrolling it into view
         video1.style.bottom = (window.scrollY - video2.offsetTop) + window.innerHeight + video1.offsetHeight + 10 + "px";   // move the video up
      }
    } else {    // if we scrolled back up, reset the style
      video1.style.bottom = "";
      video1.classList.remove('stuck');
    }
  }
};

The CSS is added directly to the theme, either in the theme customization or in your CSS files.

@keyframes fade-in-up {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
.wp-block-embed__wrapper iframe {
    max-width: 100%;
    max-height: 100%;
  }

.stuck {
    position: fixed !important;
    bottom: 215px;
    right: 10px !important;
    transform: translateY(100%);
    width: 360px;
    height: 203px;
    animation: fade-in-up .5s ease forwards;
 }

I had originally found several plug-ins that did this with JQuery or other plug-ins but about dozen lines of Javascript is all that you need.

WordPress surrounds each video in a couple of DIV tags. The outer one acts as the place-holder (so the page doesn’t adjust size) and the inner one gets moved to the lower corner by adding a class.

We let the video float down the entire page until it either hits the bottom of the page or until we run into a second video. It figures out the height of the video and then applies a CSS class called stuck if the person has scrolled the first video off of the page.

The CSS class that gets added clobbers the position of the video and locks it to the bottom of the page. The script is simple and doesn’t do much with non-youtube videos and only minimally deals with multiple videos on the page. This could be added by looking for other classes in addition to the youtube but for now, it’s simple, quick and the perfect way to float my videos and make the experience of reading while watching just a little bit easier.

You can see and play with a CodePen version of this here.