I had the pleasure of attending Compute Midwest 2016 today. There was a fantastic speaker line up with a few Kansas City natives.

Bibop Gresta  – COO of Hyperloop Transportation Technologies 

Bibop talked about their work on the Hyperloop. The most striking thing about HTT to me is not the technology but the way they’re creating and innovating on the product itself. Instead of a typical startup with employees, the vast majority of the work is done by people remotely from around the world in exchange for stock options per hour they work. This takes remote work and global operations to an extreme. 

A few more interesting notes from his talk:

  • HTT’s plan is cheaper than existing infrastructure (trains / subways) and self sustaining because it is energy net positive.
  • They’re using a polymer that he called Vibranium in all seriousness
  • HTT plans on using virtual windows with IPS and motion tracking facial software to move the perspective in the window.

 Bob Metcalfe – Inventor of Ethernet and Cofounder of 3Com

Bob talked about the history of ethernet and networking at large. He was a fantastic and engaging speaker. With his 40+ years of experience in the field he shared insights on building products and dealing with competition and snuck in a jab at the most recent IoT attack.

  • The idea for radio (wifi) was around before the first spec for ethernet made it into IEEE, the technology was just lacking so they pivoted until the time was right.
  • He stressed the freedom of choice among competing alternative products
  • He stressed that it’s not ok to be better than a competitor simply because you’re incompatible. This was a large problem that they fought when ethernet was catching on.
  • Humans are more and more strongly connected and companies who leverage this succeed.
  • Competition hardens us against the status quo.

Kaitlyn Thaney – Director of Programs at the Mozilla Foundation

Kaitlyn talked primarly about how Mozilla is larger than just Firefox, and went into more detail about the Mozilla Foundation. She went into greater detail about the history of Mozilla going back to the Netscape + AOL merger and how Mozilla split of from AOL shortly after. 

  • We should iterate until we reach intuition. This is particularly true for web and user interfaces.
  • Web literacy takes more than just developers
  • Hive KC
  • Mozilla Foundation protects and builds the open internet, but open source is still taboo. 

Adam Leibsohn – COO of Giphy

Adam was born and raised in Kansas City. His entire presentation was, as you’d expect, 250 slides of gifs. He started it off by stating loud and clear that it’s pronounced with a hard “g” – real issues first. In a nutshell, the vision for Giphy is to be the search engine of the messenger generation. Text is “outdated” as an input method and things are trending towards images, facial recognition etc.

  • Words are clumsy. They’re excellent at literals, bad at abstracts.
  • The printing press democratized storytelling, photography democratized moment sharing and the gif should democratize emotion sharing.
  • Stories are information disguised as entertainment.
  • Past and present storytelling is linear, but the web isn’t. 
  • Content needs to be translated for the web, not simply transposed.
  • They’re starting to to sentiment analysis on gifs.

Jordan Evans – Engineer at NASA JPL

Jordan shared plans and NASA’s vision for the next Mars rover in 2020. The goals for the next mission are:

  1. Determine whether life ever existed on Mars.
  2. Characterize the climate.
  3. Characterize the geology.
  4. Prepare for human exploration.

The overall discussion was very technical and he reviewed various parts of the next rover. He also mentioned that he considers Europa to be a much more scientifically planetary body to explore, mostly due to the liquid water.

Danny Cabrera – CEO of Biobots

Danny discussed a few of the challenges around 3D printing organic tissue and things that they’re currently overcoming. As he sees it there are two major reasons why biology is difficult:

  1. Biology is done (and always has been) mostly by hand and is rarely automated.
  2. Biology today is done in 2D petri dishes

Biobots aims to fix both of those issues by moving to 3D models. While printing organs isn’t on their immediate horizon, they seem to anticipate printing for the purpose of testing solutions and medicines moreso than transplanting. The idea is that pharmaceuticals and organs and remedies should be hyper localized to the patient rather than a cure all for the masses like chemo today.

Davyeon Ross – COO of ShotTracker

Davyeon showed the technologies involved in creating ShotTracker. They’re primary goal is democratizing (keyword at the conference) analytics in sports. Starting in basketball but plans to move into other sports.

  • You can’t improve what you don’t measure.
  • Pivoted from pure software to a hardware company
  • Hardware is really hard to do
  • Started purely consumer and moved to team based marketing

Alex Menzies – AR / VR Innovator with NASA

Alex talked about and demoed software that they had created at NASA for creating renderings of Mars for use in the Hololens so that geologists could actively participate in research on Mars from Earth. The software takes all photos from the live stream of the Curiosity and other orbiters and generates terrain from them. One of the more interesting parts of his presentation was a note in passing about choosing the best images programmatically because of the disparity in pixel density even at a distance between the rover and orbitals.

  • When the first people walk on Mars they will be accompanied by thousands of people on Earth, all living the experience through augmented / virtual reality from all the cameras and sensors on the planet “Telenauts”
  • In technology we go from astounding to normal very quickly.
  • The Hololens has been very instrumental in practicing installing radioactive materials on the new rover.

Augmented reality, big data and security were understandably the big topics at the conference. Several people mentioned the security breach in IoT recently. Overall it was a fantastic experience with a lot of interesting speakers.

What methods are you and your teams using to define Sass and LESS or CSS color variables?

Colors are one of those things that can be interpreted differently pretty easily, and are used throughout your entire project.

One method that has worked well for some of my teams thus far is to use a single defined source to pick the names of the color variables based on their Hex code, then determine whether to camel case, hyphenate or underscore to separate words.

For example:

$gray: #888888;
$spunPearl: #a6a5ad;
$silver: #c6c6c6;

Pros of this method:

  1. If your variable names come from one source, there isn’t a question about what constitutes “gray” or “blue.”
  2. You don’t end up with duplicate colors throughout your CSS codebase.
  3. Variable names are abstracted from their components and can be used anywhere.
  4. Easy to remember – easy to search.
  5. You never need to think about whether or not something is lighter gray, lightest gray, or lightest-est-est-est gray.

What are some other methods being used to define things like color variables in your Sass projects?

Co-authored by Preston Chandler

When used appropriately, “No” can be our most powerful tool. Truly powerful “no” users employ it in the following ways:

No, but…

… we could always try ‘x.’

We don’t need to be a yes-(wo)men or flip-flop on our opinions but we do need to give reasonable alternatives to the desired course of action. Simply saying ‘no’ without any follow up leaves the decision completely one sided and prevents actual collaboration.

By providing an alternative we’re showing that we do care about the problem at hand and are actively looking to come to a compromise.

I don’t know…

… but I’ll find out for you!

Saying that we don’t know the answer to something can show humility. The only thing we know for sure is that we don’t know everything. However, we are very willing to learn.

No, because…

… x, y, z.

Talking others through our thought process will help them to understand where we are coming from. They still may not agree with us, but they will better understand us. The ability to back up our opinions with facts, experience and a logical position is critical when speaking with someone who expects us to be experts in our given field and instills trust in our knowledge.

Not right now…

… there are higher priorities

Many times a specific course of action isn’t incorrect, it is just not timely. Taking that same course of action at a later date may prove beneficial.

In addition to the specific language used, the following “Nos” will also help:

  • No Nonsense – Don’t be wishy-washy. Own the “No”. this is a great way for you to emphasize your role as an expert.
  • No Pride – Strong Opinions, Loosely Held. Recognize quickly when you are incorrect. It isn’t too late to change the “no” to a “yes”

In development, client focused development in particular, it’s easy to get discouraged by requirements.

  • You must use a certain CMS.
  • You must fit everything within an outdated framework.
  • You must use an outdated version of jQuery.
  • You must support unreasonable legacy browsers (IE6 I’m looking at you)
  • You must run every change through x levels of client approval.

The discouragement doesn’t come from the requirements themselves, but the fact that they prevent you from producing the quality work that you would be proud of.

There’s nothing wrong with this discouragement, but don’t let it make you resentful. Those requirements are forcing you to learn and think about solutions in new ways.

Often we look at a set of requirements and then dread working until the project is over. Whether we like it or not, that’s reflected in the quality of work produced. Even if you aren’t able to write the code you want for a project, it should be the best code you can write given the situation.

Write the best you can with what you’ve been given.

5 years ago I bought my first smartphone. It was a Motorola Droid 2 and it was awesome.

Having only used feature phones up until that point, when I bought my Droid 2 I discovered a new world where anything and everything I could imagine was always at my fingertips. I instantly had a GPS, the Internet, an MP3 player, a video game console, a high quality digital camera and more everywhere I went.

It was at that moment that an Android fanboy was born. I went the whole 9 yards. I started learning Android development, I rooted my phone (obviously), I customized it to no end and I tried new ROM’s and early release updates on a weekly basis.

But with this newfound love for Android came an equally strong disdain for all other phones. I didn’t care that the iPhone came first and was one of the original innovations in the field. It didn’t matter, Android was king.

I had what I thought to be legitimate reasons for believing this. Most of my problems with iOS were related to storage and customization. I really enjoyed having a phone that I could connect to a computer as external storage. I liked being able to customize the majority of the phone without even rooting and I loved the fact that it was Open Source.

So 5 years passed and I was your classic Android evangelist. To anyone who asked (and would listen), I would explain why Android was superior and list my grievances against the iPhone. But guess what?

I don’t care anymore.

No seriously. I own an iPhone 6 and I love it. It’s incredibly simple to use, it’s intuitive, it just feels right. But then again, Android has a lot of those similar qualities and more.

I am now firmly of the opinion that Android, Windows Phone, the iPhone, Blackberries etc all have their place. One reason there are so many different types of phones is that no one’s needs are identical.

Right now an iPhone fits my needs perfectly. From 5 years ago to this point it was Android. Who knows, maybe in another 5 years a Blackberry will be just what I’m looking for. The point is that there isn’t, and probably shouldn’t be, a one size fits all solution. Pick the phone that works best for what you need it for, and enjoy. Looking back, my staunch love for Android and nothing else was misguided and wasn’t actually doing anyone any good.

The only reason we should care about what type of phone a person is using is from a development and designing standpoint. We need to test and optimize for all phones, tablets, computers, watches, glasses and whatever else our users are viewing our apps or websites on. It’s not easy, in fact it’s damn hard, but it’s absolutely worth it.

There isn’t anything overtly ‘simple’ about increasing conversion rates, so let’s forget about that right off of the bat. Most sites we visit have a list of 3-7 ‘simple’ ways to increase your conversion rates ‘overnight.’ If you’re looking for a list like that, this isn’t the place to be.

That said, if you’re looking for a quality long term solution and for ways to learn more about your customers in order to serve them better, then read on.

1. Data Driven Development

Using intuition and gut instinct is great, I encourage it. It’s what moves us along and sometimes brings in fresh new ideas. If all we do is based on our intuition, however, something is wrong.

Ideas need to be tested. Say that we’re consulting on a site’s conversion rate, and in the process it’s suggested that we introduce more icons into the navigation. This could be a great idea for one site, but a poor idea for another. It depends largely on our audience and their demographic.

Some ideas and design patterns for websites do translate (relatively) well across most websites. These concepts tend to be more usability driven, however, and have been tested for years across thousands of websites.

2. Data Driven Development

Are we using Google Analytics or another interaction tracking metric? If not, we need to be. Without some sort of way to track how users interact with our site then we will forever be guessing at what to do.

Where are customers dropping off of our site? Are they more likely to move through a certain funnel than another? This is where A/B testing becomes necessary. Sure, it might be easy to just implement the site changes that we want and then leave it, but that isn’t realistic for a lot of companies. Design and usability changes can easily make or break a site and it’s in our best interest to know what helps and what doesn’t.

If we’re A/B testing our site, then we have conclusive proof that one design style works better than the other and we are able to confidently go about making similar changes.

3. Data Driven Development

Who are we designing our site for? The search engines? If so, we’re doing it wrong. Search Engines don’t have opinions like humans. We might be able to A/B test that one change increases our overall traffic more than another and that’s great. Keep that. But even more important than increasing our traffic is making our current traffic count for even more.

If we design our sites for our users, not robots, conversion rates will rise.

No one knows our customers better than we do, so we need to do everything we can to make our customers feel comfortable, safe and engaged. If we can do that, we’re doing something right.

Disclaimer – I’m working on a Windows machine, so any instructions on set up listed below are strictly for Windows. Not OSX or Linux. There are plenty of instruction guides elsewhere for OSX and Linux such as The Sass Way.

Admittedly I’m a bit late to this parade myself, but I had a hard time grasping the benefits at first. I’m a sucker for optimizing my sites for speed and for some reason I was under the assumption that CSS Pre-Processors had to compile the stylesheets on the fly and were served fresh every single time a page loads.

This simply isn’t the case and I’m not sure why I ever assumed that.

Essentially the way the Pre-Processor works is not much different than just writing your average CSS file. Once you have the Ruby gem installed (I’ll walk you through it) you just write your Sass/SCSS and be on your merry way.

This is all done locally on your development computer, not on your server. In some cases you’ll want the gem installed on a server, but most do fine with a local installation.

First things first – What is Sass, and why should I care?

Sass (along with other languages such as Less) is a CSS Pre-Processor.

“Lot of good that definition does me.” I hear you say. “So, what’s a CSS Pre-Processor?”

Basically a CSS Pre-Processor is a way to extend CSS’s native abilities far beyond where they currently are. For example, have you ever used a single color for multiple elements? Of course you have. You probably used the hex or rgb(a) value too and if you’re anything like me, you probably had to look up that color’s value countless times during development as well.

With a CSS Pre-Processor, that’s a thing of the past. You can assign values to variables and use them straight in your CSS. So for example, with Sass you would do the following:

$headerFonts: 'Open Sans', Helvetica, Futura, Arial;
$gray: #ccc;
h1 {
font-family: $headerFonts;
color: $gray;
}

And it would output the following, to your CSS file:

h1 {
    font-family: 'Open Sans', Helvetica, Futura, Arial;
    color: #ccc;
}

It’ll be indented all nice and everything! Clearly if you just use a color or font-family one time in your CSS, creating a variable for it might not save any time. However if you’re like most developers and have colors and sizes all over the place and need to get them all under control for easy editing, this will be a HUGE time saver.

Guess what? Variables are just the beginning. You can also use things like…wait for it…math. That’s right, you can use math and calculate things right in your stylesheets! If you don’t see any value in that you can just close your browser and go outside. That’s enough Internet’s for you.

However the purpose of this post isn’t to explain all the cool features of it. There are plenty of resources to learn the various things you can do with pre-processors. No, the point here is to walk through getting set up to start using Sass on Windows.

And Secondovly – Getting Windows Ready

Ok cool, so you’re running Windows and you’re all like, I don’t get it. How do I start writing Syntactically Awesome Style Sheets?

Installing Ruby

Well to start out with, you’ll have to install Ruby on your computer. It’s pretty easy, really. Visit Rubyinstaller.org and pick the proper installer for download. Once its downloaded, just run the executable file to finish installing Ruby.

Installing the Sass Gem

Ruby works with little (or big) libraries/packages or ‘gems’ that basically contain files for installation. Sass is one of those gems. In your Command Prompt type the following:

gem install compass

Now hit Enter/Return.

Wait. What’s Compass? I thought we were installing Sass? We are. Compass is actually a Sass framework that is going to speed up development. If you install Compass, you’ll automagically install Sass along the way. If you want to just install Sass without installing Compass, just type in:

gem install sass

And hit Enter/Return.

And that’s pretty much it. It’s a fairly easy install over all and you only have to do all this once, but the fun has just begun.

Your first Sass project

Now comes the fun part, actually using Sass. In your command prompt, cd to your development directory. If you don’t know how to cd to a directory, it’s pretty simple. If your development folder is called ‘test’ on your Desktop, you would type something like the following in your command prompt:

cd C:UsersIvanDesktoptest

And hit Enter. Then type the following in your command prompt:

compass create hello-sass

You know the drill, hit Enter. What you’ve just done is create a blank Sass project in the ‘test’ directory. You should see a folder named ‘hello-sass’ with a few files and folders inside. Ok, one last Command Prompt script and we’ll be done with that:

compass watch

What this does is watches the .sass/.scss files for any saved changes. If it see’s changes, it’ll automatically compile them for you.

Writing Sass

In the directory that was created (hello-sass) find screen.scss and place the following inside:

$headerFonts: 'Open Sans', Helvetica, Futura, Arial;
$gray: #ccc;
h1 {
font-family: $headerFonts;
color: $gray;
}

Save that file, then find and open screen.css. You should see the following:

h1 {
    font-family: 'Open Sans', Helvetica, Futura, Arial;
    color: #ccc;
}

Congratulations! You’re on your way to writing better CSS already.

Adding Sass to an Existing Project

So say you’re working on a WordPress theme, and you have the themes folder already created with a bunch of files in it already. How would you add Sass to that project? Well as luck would have it, that’s pretty simple too. Compass has an excellent tool on their website that allows you to enter the parameters of your project, and it will give you the command prompt script to run.

For example, if I want to add Sass to a theme in a folder named ‘the-sassiest’, with a javascript and images directory, I would cd to the wp-content/themes/ folder of my WordPress installation, and run the following command in the command prompt:

compass create the-sassiest --bare --javascripts-dir "js" --images-dir "images"

That creates a new project (complete with a config.rb) with no starting Sass files in the already existing directory ‘the-sassiest.’

Where to from here?

There are plenty of resources out there for writing Sass, and the numerous benefits it carries. The best place to start learning the Syntax is, as usual, the official Sass Reference Guide. Get started on a project and just dig in. Don’t just fiddle around with it. Start using this on a project that matters and you’ll pick it up in no time, and beyond that…never look back.

WordPress 3.7 is out and while it may not look all that different, we’re all better off for it. There’s an excellent article on Post Status about the update, so I won’t go into too much detail but there are some exciting changes in this newest update.

Automatic (and seamless) Background Updating

WordPress now comes with background updating out of the box. This is a wonderful new feature and something that I’ve been eagerly anticipating for a while. I hate going through all of my WordPress sites and manually backing things up, and updating each site one by one. It may seem a trivial task, but if you have more than one or two WordPress sites it can be a real time sucker.

This automatic background updating comes with a few caveats, however. For example, by default it will only update to security releases (eg: 3.7.0 to 3.7.1) and it will not automatically update to a new version (eg: 3.7 to 3.8). This is for fairly obvious reasons such as, WordPress doesn’t want to be responsible for breaking your damn site. However if you feel like living on the wild side, you’re free to add the following to your wp-config.php.

define( 'WP_AUTO_UPDATE_CORE', true );

That tells WordPress to go ahead and throw caution to the wind and just update the damn core while it’s updating everything else! Note that I don’t recommend this on a clients site. If it’s your own site, then whatever. That’s your prerogative.

You can also do some cool things like auto updating (many, but not all) plugins and themes using auto_update_theme and auto_update_plugin. But you can read more about that in the Codex.

Better Search Functionality

WordPress search has (historically) sucked pretty hard. Don’t get me wrong, it works…alright…sometimes. Essentially up until now it’s been ranked more on publish date than post relevance. All of that has changed with Basie and we’re finally going to be seeing better search. This is super important for sites that have a ton of content, so an updated search feature is more than welcome.

I’ve been tossing around the idea recently of a plugin for extending the search to query the database asynchronously and provide on page results without loading a new page, ala Google Instant Search. Generally you don’t want your search pages indexed anyway. It may be out of my immediate wheelhouse but I may give it a go anyway.

But that’s not all, folks!

While those are the two features I’m most excited about, there are a ton of new and improved things in Basie like an improved password meter, better language packs, improved inline documentation and so much more. You can read more about everything at Post Status, as I mentioned above.