The crew worked late into the night Wednesday, eager to push themselves as far as they could go in search of VAX greatness. Lone Star Beer once again poured freely for the developers and designers of the Vox Media product team.
As Thursday morning dawned on Austin, the team returned to our temporary office space. Everyone was ready to pick up where they left off on Wednesday night, transitioning ideas off of whiteboards and onto computer screens.
Where Wednesday was cloudy and cool, Thursday proved to be sunny and warm. The office space came equipped with a great patio, and the 20th floor view of the Austin cityscape proved hard to ignore, even with a brisk wind coming over the balcony wall.
By lunchtime, we had worked up an appetite, and our office manager, Thomas, made sure we were well fed with pizzas from Austin’s Pizza. The fridge was fully stocked with sodas and water, and coffee brewed all day long.
With the sun shining through the windows, projects began to take shape. Binder’s developers were focused on the user experience of their wiki project, while team designer Warren mocked up several logo options for the internal tool.
Polyphone, David’s Polygon iOS app project, was well on its way to becoming a full-featured experience: not only were Polygon logos placed throughout the app on loading screens and menus, but Polygon articles were filtering through into the main interface.
The Polygon digital magazine was also finding its form: the core group of designers were quickly becoming experts in Mag+, honing their craft and adding layers of functionality to the digital magazine’s user experience as their skillset grew.
Providence, a traffic analysis tool, was on its way to delivering real-time data to stakeholders and focused blog managers. Beacon, a top-down view of the product team’s workflow, had come a whole lot closer to being the ultimate resource for at-a-glance information about day-to-day progress on bug reports, sprint work and deploys. All the other projects continued to evolve in preparation for Friday afternoon’s big reveal.
As day turned to dusk, VAXers turned their attention to the skyline: a magnificent sunset reflected off the clouds, showcasing brilliant hues of orange and pink. With nightfall came a resurgence of activity, and the product team continued to labor late into the dark. Games of Tetris and ping-pong offered a brief break from the hard work, while bourbon and beer were sipped from plastic cups.
If there’s one thing to eat while in Texas, it’s barbecue. An order was placed with Dickey’s Barbecue Pit, and Thursday’s dinner did not disappoint — a full spread of pulled pork, brisket and sausage provided a tasty main course, while delicious sides of mac and cheese, baked beans and potato salad were piled high on the edges of every plate. There was no such thing as a single helping, as the crowd picked away at the remaining assortment of meats and sides as the evening wore on.
With little over 19 hours to go before the teams unveiled their proof of concepts and works in progress, plenty had been accomplished. Apps were functioning on simulators, rails applications were evolving, and user interfaces were being fine-tuned. VAX was pushing forward at full speed, and there was no signs of slowing down for the product team entering the final day of VAX ‘13.
We had great night of team bonding on Tuesday, and by Wednesday the Vox Media product team was ready to kick off VAX ‘13 and start hacking.
After a few breakfast taco expeditions to soak up the mistakes of the night before, we gathered at our hackspace on 9th Street in downtown Austin. Our VP of Product, Trei Brundrett, gave a brief keynote to kick things off, and the newly-formed teams hit the ground running on their projects.
The VoxCar team quickly claimed the Tarrytown conference room. The All-Seeing Eye team gathered along the windows facing north towards the University of Texas campus. The main room was filled with the rest of the teams huddling around a table or two. VAX had begun!
A few of the teams had planned out the early stages of their projects already and progressed quickly into the execution phases. Featherbottom, a team working towards streamlining the photography process at live events for our editorial teams, was soon showing off instantaneously watermarked photos.
The Polygon iOS app team had already developed a gorgeous navigation menu prototype. Beacon, an internal planning tool, was deep into back end implementation, as was VoxMox, a project automating advertising and sales mocks.
Some of the other projects ran into early hiccups. The team building a web magazine version of Polygon found that the majority of the team needed to upgrade to Mountain Lion due to compatibility issues, which ended up being a bit of a timesink. The All-Seeing Eye ran into a similar issue, needing both recent site data and Mountain Lion upgrades.
VoxCar, the all-encompassing company documentation project, was still in early planning, and the seven-person team discussed feature requirements, product vision, and technology choices during their morning meeting. Progress was swift, and by the end of the day the team already had a rails app spun up on Heroku. They had also renamed; they are now Binder — a tool for storing information and binding our far-flung team together.
Of course, it wasn’t all business on the first day of VAX. The ping-pong table provided some much needed breaks. The NES saw a lot of action, though Tetris wound up being more stressful than relaxing for some team members. The early afternoon provided a few opportunities to sample some of Austin’s great coffee shops. Later into the evening, dinner and beer were acquired and the GameCube’s four player mode came in handy.
Some of the team went on a field trip to Sanctuary Print Shop in the afternoon. They got the opportunity to check out how the shop operates and were able to grab some swag to take home. The group of travelers also came back bearing gifts: official VAX ‘13 t-shirts!
By the end of the day, everyone was well on their way to achieving their VAX goals. The Mountain Lion upgrades went well, new data was fetched, and projects were properly defined. Thursday has shaped up to be wall-to-wall hacking, and the product team is excited to see their products evolve and take shape on day two of VAX ‘13.
The Vox Media product team is always coming up with ideas for smaller projects that do not necessarily fit into our regular sprints. Our backlog for these projects has been growing steadily, and a couple of enterprising team members decided it was time for a hack conference. V(ox) (H)AX was born!
VAX is a three-day hackathon that starts today, Wednesday, February 20 and wraps up on Friday, February 22. The ideas being worked on at VAX are forward-thinking and full of creativity. During normal development cycles, the product team focuses on projects that are prioritized by company needs. At VAX, the scales are tipped, and the product team has full creative control.
36 Vox employees have descended on Austin, Texas for an epic week of product development — the team will dig into their creative sides and produce new products that will allow Vox Media to carry out its mission as an innovator in the digital media landscape.
Over the past several weeks, product team members have developed their ideas, divided into groups and committed to conquering new goals together. Skill sets will be developed, talents will shine and barbecue will be consumed.
While Austin is sunny and beautiful this time of year, this isn’t a vacation. The product team has dedicated themselves to long days locked into a rented office space. There will also be plenty of team bonding: VAXers have planned morning jogs, and a Nintendo Entertainment System was shipped across state lines for late-night Tetris battles.
Prior to attending VAX, the teams that were assembled each submitted a list of objectives that they wanted to achieve on their projects. After three days of hacking, each dev group will showcase their product to the rest of the team in a five minute presentation. By the time the product team heads home, many ambitions will have become reality.
The team began arriving in Austin yesterday, coming in from all directions. Employees from Santa Barbara, Boston, New York City and Missouri got to the Texas capital and reunited with the DC-based product crew.
The crowd got their bearings at our downtown hotel before heading out and experiencing some destinations on 6th Street. Street food was devoured and delicious Lone Star Beer was imbibed.
Today, the hard work began. Here are some examples of VAX projects being developed this week:
VoxCar: The team building VoxCar has stated that the project’s goal is to “share knowledge, build shared experience, and make things easier across the company.” It’s important for a company to retain its cultural roots and provide a way for the team to remain close while being a part of a rapidly growing company. It’s not a Wiki, but it is a place for knowledge retention and the enrichment of our team’s collective intellect on all things Vox.
Beacon: A window into the product team from the top down. “Beacon is an internal tool to monitor projects and sprints and deploys across teams at Vox Media,” product manager Justin Glow said. “It’s a tool to create transparency,” added VP of Product Trei Brundrett. In a convenient view, all product team work (past, present and future) will be accessible to stakeholders for a variety of uses, including helping prioritize development work.
It’s a TRAP—-ezoid! The Polygon Digital Magazine: “We want to come out of VAX with a clear process for production of a digital magazine,” designers James Chae and Tyson Whiting said. The designers are using Mag+, which is very designer-friendly. To limit the scope of their exercise, they are developing the magazine for the iPad while at VAX. Streamline Features Team: “A user-friendly visual design interface for building features,” designer Josh Laincz said. “Because of our limited time, we’re trying to get a road map, wireframes and hopefully some visual mockups. The goal is to have a concrete idea and mocks by the time we’re done.”
Working title — Featherbottom: “We’re building a tool to get photos from a camera to the internet without wires.” The goal is to create an unmatched experience for liveblogging. To take photographs from camera to computer, apply a watermark and upload them to Syllabus, Vox Media’s liveblog tool, in one automatic step — all wirelessly and instantaneously.
VoxMox: “We’re working on an internal app to help our sales process,” developer and Austin citizen Ben Alt said. “For smaller sized ad campaigns, we will alleviate the pressure on our designers. VoxMox will give account managers the ability to create comps without going through a designer.” All Seeing Eye: “We’re building out a real-time traffic analytics platform. We have a mishmash of existing analytics stuff, but nothing that is comprehensive across all our properties,” developer and Michigan alum Clif Reeder said. “The main selling point to me is that we’re baking in different contexts. There’s a lot of different ways of thinking about our chunks of traffic.”
The Vox Media product blog will be reporting daily from VAX, monitoring the development of the various projects and sharing with the world how many food truck tacos have been consumed by the product team (as of today, it’s roughly 45).
After a 10-hour trip from New York to California then to Las Vegas, I was looking forward to two things— a double-double from In-N-Out, and eating it disgustingly on my hotel bed. These wonderful dreams quickly dissipated as my cell phone service came on.
My name is Chao Li, and I’m the Support Manager for The Verge. I answer all the support emails, monitor the Verge support twitter account, and I’m responsible for communicating and helping with site feature additions, changes, and fixes. When something breaks, I’m in the first line of defense — except this time, I was in the sky with no WiFi. It turned out that Chorus, Vox Media’s modern media stack, was acting up and it was taking an extra long time to publish articles. This was not the way we wanted to start CES.
Photo by Guillermo Esteves
I stepped into the double-wide Verge trailer that I’d spend at least 12 hours in every day for the next week at around 8pm. With hardly any time to say hello to the editorial team, I quickly ran into the product room — where I was greeted by a calm James Chae, one of the designers of The Verge features, and an exhausted-looking Guillermo Esteves, the magician that people refer to as The Verge’s front-end developer.
“It’s fine now, but I have so much to fill you in on,” Guillermo smirked as he looked up from his monitor.
CES, the Consumer Electronic Show, had started that day with some pre-CES meetings and events but the exciting stuff was still to come. Guillermo, James and I were chosen to represent the product team at CES. We were supported by an army of developers, designers, and operations friends from across the country.
For 7 days we woke up at 6:30am or 7am, got to the Verge press trailer by 8am and worked until midnight or 1 am. Coffee, bagel, 2nd coffee— I ate the same things as if it brought me luck.
Photo by Nilay Patel
For CES, we rolled out a video player for the front page and the CES hub along with some other small changes. We were there to help the editorial and video staff navigate through all the new features. Guillermo Esteves built the features and fixed the problems behind the scenes. For example, when we first launched the CES hub, it had a scrolling carousel for new products. After a few days, there were so many new products coming out that the carousel became heavy and it took a toll on the load time of our site. Guillermo came up with a solution to take out the carousel and make the ‘more’ arrow into a link to that particular story stream’s landing page instead. Within an hour, we had a new and improved module on our site.
Photo by Sam Byford
On the second day, our slow server problem returned. During CES, we were doubling and tripling the amount of posts that we normally do while handling a spike in traffic at the same time.
During stressful times, people were depending on us to stay cool and to come up with speedy and reliable solutions.
Guillermo partnered with our DC friends to come up with a solution while I took care of communication and tried to come up with other work arounds. A solution finally came, we didn’t know if it’d work. At the last minute, there was an error in the code. “They’re gonna bury us in the desert.” Guillermo half-heartedly joked. Things were tense in the trailer. The issue was fixed an hour later but it was one of the worst hours to sit through. At moments like this, you really find out if you’re cut out for this job. We celebrate the victories and learn from the challenges.
After 3 straight days at the trailer, Guillermo and I stepped out onto the show floor as a treat for ourselves. This place was huge. Guillermo drooled over the tower of Nikon lenses. While I wanted to buy out the entire Hello Kitty booth. We failed to finish central hall in 1 hour.
Photos by Chao Li and Guillermo Esteves
It had been a slow day, Guillermo — who still had serious insomnia, took off to work from the hotel. Around 10 P.M., about the time I started to look at cat pictures, our site stopped loading. Guillermo rushed back to the trailer and we were in emergency mode. The developers on call were woken up from coast to coast. After 30 min of our hearts pounding, we found a solution. Tired but feeling great, we closed the lids to our computers and called it a day while Ke$ha blasted in the newsroom of our trailer on repeat.
Around day 4, people began to get sick — real sick. TC Sottek, one our writers, was out of commission for 2 days. Late night on that second day, he ended up going to the hospital for a very bad flu. Others coughed, sneezed, and covered themselves in Purell.
That night, James Chae introduced me, Guillermo, Michael Shane, Ross Miller, Thomas Houston and Paul Miller to some amazing Hawaiian food. We all started off quiet at the table, most of us hadn’t slept for more than 5 hours a night for 3 or 4 days straight, and some were still sick. As we stuffed our faces with take out containers of meat, gravy, spam and rice, we became revitalized. As soon as things began to feel calm for the first time in a couple of days in the conference room of our hotel, our phones began to beep and shake. Paul and Michael had to go prep for the Vergecast, Thomas had to get back to work, James ran off to finish a layout, and Guillermo, who had the hardest time adjusting to Pacific Time, went to work from his room.
Photo by Guillermo Esteves
The rest of the work week quietly passed us. We started to have more time to go out later at night. James got sick on the last day. We worked until the electricity and internet was cut off in our news trailer. For the first time in a long time, we left work while the sun was still up.
Photo by Sam Byford
This was the first CES that Guillermo and I have ever attended. We had no idea what to expect. I’d been with the Verge for less than a month, and Guillermo had been a developer for Vox Media for less than a year. James Chae was the only CES veteran out of the 3 of us.
I think Guillermo put it the best when I asked him to wrap up his feelings about CES.
“It was a long, stressful, but ultimately fun week. I’d do it again in a heartbeat.”
As you may have heard, the Super Bowl was this past Sunday. Apparently, this is kind of a big deal for sportsball fans, and thus, the SB Nation network. It’s usually one of our biggest traffic days of the year, so there is a lot of excitement/paranoia around it from the Product Team. While we were talking about all the things going on and what might happen, I had the thought that it would be cool to see a map of all the comments on our network during the game - so I made one.
In the video, comments from our Ravens community, Baltimore Beatdown are shown in purple, and comments from our 49ers community, Niners Nation are shown in red. Comments from any other community are shown in green. When there is a lot of comment activity in one area, the dots start drawing on top of each other and it’s more of dark colored blob than a colorful dot.
Between 4PM and midnight EST, we had 49,632 comments created on the SBN network. It is worth noting that only 35,861 of those are actually mapped here, since for some comments I was unable to determine location, they were not in the US, or I was already mapping something at that exact location in the same minute. Not surprisingly, most activity comes from major population centers, so it’s hard to tell who exactly they are rooting for.
The technical details of how this was made are a bit hacky, since this was just a fun side project. D3.js provides the backbone of this visualization. It was my first time using it, and I found it to be relatively straightforward and powerful. I opted to use d3.js rather than something like Processing (or Processing.js) because it has crazy easy mapping and geography support.
The data for the visualization was put together using a combination of SQL to get comment timestamps and IP addresses (which we store for every comment) from Chorus, Awk to format the result, and the geoip gem to approximate the latitude and longitude based on IP.
Unfortunately, the animation isn’t really as smooth as I hoped. I think this is partially my inexperience with D3 and SVG drawing, and partially that JavaScript isn’t the best way to animate 45,000 points. In general, I found that reducing the number of SVG path elements greatly helped the rendering. I started off rending just one MultiPoint path, but split it into many Points so that I could animate them separately. This brought rendering to a total standstill, so I started segmenting comments into buckets so that ones that would be drawn at the same time would be one MultiPoint object, and thus one path element. This helped rendering significantly. Each bucket is further divided into three MultiPoints so that they can be color coded according to community, which unfortunately made rendering a bit slower again, but the trade off seemed worthwhile.
If you want to try and run the animation yourself, the code is available here, but be warned that it runs even worse piggybacking off blocks/GitHub than it does served locally.
We’re building great things, and we need your talent! Check out jobs.voxmedia.com for our current job listings.
Hello, we are the Vox Media product team. We are designers, developers, operations engineers, and product and community managers, based in Washington, DC, New York, and Austin, and distributed remotely in cities from Santa Barbara, California to Springfield, Missouri.
Streamline Features Team: “A user-friendly visual design interface for building features,” designer Josh Laincz said. “Because of our limited time, we’re trying to get a road map, wireframes and hopefully some visual mockups. The goal is to have a concrete idea and mocks by the time we’re done.”
All Seeing Eye: “We’re building out a real-time traffic analytics platform. We have a mishmash of existing analytics stuff, but nothing that is comprehensive across all our properties,” developer and Michigan alum Clif Reeder said. “The main selling point to me is that we’re baking in different contexts. There’s a lot of different ways of thinking about our chunks of traffic.”
