Posts by Randy Gingeleski

Treehouse vs. Code School vs. Uncubed Edge

Is Uncubed Edge any good? Worth the $19/month?

What's in each "class"?

 Building a Large Audience (with Contently)

1. Data-driven content creation
2. Original research
3. A/B testing (split testing)

• Google Analytics - wasn't possible to see whether the user was scrolling, highlighting, whether they had  YouTube open in another tab...
• Get a user to spend at least 3 engaged minutes with your content, there's an over 50% likelihood of them coming back in the next week.
• Built their own analytics product (Contently Insights) which essentially measures how engaged users are with the content.
• For example, there's a running aggregate timer for each user. Time each individual user spends on each story - what they care about.
• You can write things that get a lot of people but don't hold their attention and build a relationship. (Reach vs. building an audience)

• Insights proved better than Google Analytics when it came to measuring growth, audience building, future success pieces.
• Sometimes an in-house solution for metrics can be best.
• Getting more data-focused about content on the publication helped build an audience quickly.

• They were writing interesting things, but not introducing "really new" content to the Internet.
• With original research, you're producing content people will quote and recite.
• By introducing the research Contently also became applicable to journalists. Then journalists are pointing to you.
• "There's going to be research." Then captured emails - if you wanted to get the research report, had to submit your email.
• Siphoned off audience from all the places writing about them.
• Email is still the most important tool you have as a publisher. It's a relationship you own, and it's the spark that starts the fire of sharing.
• Here's one of their studies on disparity between "sponsored content" on social media and organic content:

• That was just introducing new research on the back of old research. Proved extremely popular.
• If you think a piece will go really big, it may not be worth collecting emails. What you get may not be what you truly want.
• OKCupid's Trends blog - not targeting online daters, but reporters who'll write about their stuff...
• Everyone reads that -> OKCupid publicity
• When people write about you, they inevitably mention what you do.
• By doing research yourself, you're providing something genuinely new to the Internet. You're making the news.

• Contently conducts heat map testing (i.e. Inspectlet).
• Split tests headlines - ultimately finding a permanent one.

• You can "feel" like something's a good post or good headline, but without data it's negligible.
• Businesses like Huffington Post were built on split-testing.
• As a result, The Onion writes 25 headlines for each story to figure out which one's the best.
• Upworthy is the fastest growing media company in the world and does the same thing, with about a dozen options.
• Testing email subject lines is easy with Mail Chimp. Allows you to send out to just 10% of audience, for example, then gauge results.
• Headlines, email subject (via open rate or click rate), images - split test everything you can.
• Often A/B test results will surprise you. A gut feeling isn't nearly as powerful as data being tracked progressively.
• You always want to be using your content resources in the most efficient way possible.

MetaSQL (with Gilt)

• Was using Aqua Data Studio, loaded with U.S. Census information, for demo.
• MetaSQL can be applied to any SQL server.
• Instead of writing SQL to get min, max, and average of all columns you can write SQL to write that SQL. (Meta)
• Here's a MetaSQL snippet and the 10 lines of SQL it outputs:

• Writing that by itself, statement by statement, would have been long and tedious.

• In MetaSQL, with every iteration you can make it better and better.
• Once done you can use it on any table, any number of attributes, anything.
• Becomes universal procedure other people can reuse without knowing how it's done.
• If you replace a specific table name with a universal operator, MetaSQL will go ahead and do the work on all tables in the database.
• You can make your MetaSQL "smarter" much like you would make SQL smarter - "if column is ____, don't treat data as numeric", etc.

• The next person using your MetaSQL would just put their table name in, and they have an immediate insight without the legwork.

• Expanding on this whole idea - say you try to sell 1000s of products, some didn't sell.
• Now you want to go through all product to find out why. (Univariate analysis)
• Manually you would have to go through maybe 100s of attributes - i.e. "what's the average price of products that sold vs. unsold?"
• Then you might say "oh that didn't differ enough", then compare the next attribute, over and over for days or months.
• Generate MetaSQL that writes SQL to go through every attribute, compare in matrix one group vs another, and single out where there are differences that are statistically significant.

• This all falls under "lazy" programming principles - don't repeat yourself, save time, work efficiently.
• With MetaSQL you can write something to do your SQL writing, the time-consuming and tedious.

Transitioning to a Responsive, Adaptive Site (with Gilt)

• There was a mobile version of the Gilt site ("m.gilt.com") from when mobile browsing was primarily just Blackberry.
• That was an MVP, barebones shopping, product pages were static, no Javascript, minimum CSS.
• Next there was a client app built on BackboneJS. A lot better but mobile was still being considered an afterthought.
• Slowly, and then very quickly, that client app couldn't keep up with the new features on the core website.
• The core website, obviously, started with the intention of maximizing user experience on the desktop.
• So Gilt took a transitive period of time to shift the core website into a universal web experience across devices.

• Responsive = changes in the width of the viewport
• Adaptive = changes in the features available to you
• Overall you want to maximize user experience regardless of the user's device.
• When the user lands on your site, you need to maximize experience for that viewport. (Responsive)
• No one just sits there, changing the width of their viewport back and forth all day.
• Maybe an iPhone 5 has different touch gestures than an early Samsung Galaxy - must be considered. (Adaptive)
• As a desktop experience is transitioned to responsive, the code becomes more complex. There's no way around that.
• Take care to craft maintainable code, something an engineer walking in off the street could work on.
• When Gilt receive a user agent, they send it into one of 3 "buckets" - minimal, intermediate, or full.
• Full experience is everything - like desktop. Minimal might be on a low-bandwidth network or older browser - capabilities pared down.
• For Gilt it's important to know which devices customers are most using, then emphasizing on making a beautiful experience for those.

• Gilt has Handlebars references to the minimal target experiences (from the above image).
• Through those references you can write DOM features for when the device meets certain levels of target experience.
• It's important that devices don't take any DOM or payload they don't need. That's why this is done the server-side.
• On low-bandwidth networks, Gilt frequently excludes all tracking. Tracking code can be heavy and degrade from user experience.
• Obviously that doesn't help the marketing department but it does help the members.

• Target experience gets appended to the window object.
• This allows for client-side visual manipulation, while the Handlebars was dealing server-side.
• In the Javascript you can have different functions depending on which experience is coming through.

• On a desktop Gilt product page you have a lot more capabilities. You can zoom and quickly click through a product image carousel.
• On an iPhone, you can swipe through images via touch. Giving a similar experience to desktop but things had to be coded differently.
• This is an example of target experience use over "hope one size fits all" approach.

• Media queries are great building blocks, but only great if they're used consistently.
• LOSA = lots of small applications
• Instead of focusing on monoliths, Gilt decided to focus on services.
• LOSA at Gilt means most of the pages you see are largely driven by individual apps.
• The Product Details page can be deployed independent from the Product Listing page, for instance.
• This promotes autonomy in terms of teams and features.
• This minimizes the chance of "side effects" when releasing code.

• Gilt has tens of thousands of lines of CSS. How do you organize that?
• Originally media queries were written underneath the code they were superseding. Fine if you have a small amount of code.

• But this becomes confusing once the code grows, things are really amped up, there are a lot of breakpoints... unwieldy.
• Then Gilt came across RespondJS (polyfill) - where to put media queries in CSS was no longer a dilemma, especially with old IE support.
• If someone came in to make a change on the old jumbled CSS, maybe they wouldn't think about all the references of everything going on.
• The idea is to minimize opportunities for human error.
• In-line media queries > separate blocks

• Images are heavy, especially for mobile, and can be problematic if not handled well.
• Gilt uses large images which creates a dilemma - they want beauty but at a small cost. (Resource cost)
• Their handling has images being passed down as they're needed, and at particular break points for different sizes.

• They use PictureFill. You don't want to send a huge image to a small device - that's an unnecessarily big payload to scale down.

• User agent emulation in Chrome and other browsers is really useful, obviously something that couldn't have been done 10 years ago.
• Have to be aware, though, that if you're emulating a user agent in Chrome you're still on the Chrome browser.
• Gilt uses Genymotion and other tools to simulate different browsers / OS.
• Want to make sure changes you make in one area won't adversely affect others.
• Throttle test different connection speeds with something like Charles - what if someone's on the highway in a remote area?

• Gilt transition started technical, then focused on QA and bringing design into the picture.

You can sign up for Uncubed Edge here.