LinkedIn UED: The Early Years (2003-2007)

Post on 07-Nov-2014

1.713 views 0 download

description

Early history of LinkedIn's UED team, including screenshots, key employees, and assorted hijinx. This was presented to the LinkedIn UED team on June 18, 2013, to commemorate the hiring of LinkedIn's 100th web developer.

Transcript of LinkedIn UED: The Early Years (2003-2007)

LinkedIn UED: The Early Years2003-2007

Before I left in late 2011, I put together this timeline of LinkedIn's history, highlighting key moments, events, etc. Now at ourstory.linkedin.comToday, I want to go a little further and talk specifically about the history of the UED team If the timeline is the intro course in LinkedIn history, this is the graduate-level seminar

2003

Internet was a very different place in early 2003 No: Facebook, YouTube, Twitter, Tumblr No: Web 2.0, AJAX (Google Maps 2005, GMail 2004), tagging (Flickr, Delicious) No: Chrome, Firefox, Safari (in beta); IE ruled both Windows & Mac (IE5!) No: Ruby on Rails, Django, Node.js (2009) No: iPhone, AndroidNo beard either

One thing that was around... Friendster (Summer 2002) Not a new concept (sixdegrees.com), but first to go mainstream Huge idea that really took off; the ability to see your friends of friends Easy to mock now for its technical/business missteps, but was white-hot in 2003-4 Kind of an inspiration for LinkedIn

We started building LinkedIn in late 2002 Team made up of mostly old colleagues from a company called SocialNet Founded by Reid in 1998; seven of the founding team members worked there including Reid, Allen, Jean-Luc, Yan, Ian McNish, David Eves, and myselfWe broke the work into six phases, working from mockups (not visual) that Allen created Idea was to have a completely usable system by the end of each stage Covered Login, Invitations, Profile, Search, Requests (Introductions), and SubscriptionsThis is one of Allen’s mockups for Phase D No visual design yet; this is all placeholder Even the company name was still considered temporary (hoped to think of something better)We decided to use Java/JSP since the ex-SocialNet employees (Yan, JL, me) were all familiar with it Fulfilled our needs and let us hit the ground running Hugely important in a bootstrap startup situation where you want to get something live ASAP

This is an early CSS layout test I did (February 03)On the front-end, I decided early on to build the site using CSS (no tables) for layout A lot of blogs were doing this, but Wired was the only big site to have done it (Oct 02) ESPN switched in Feb 03 which helped validate the decision a bit Made for some really clean JSP pages, which made it easy to go back and forth with Yan when we were working on features

Launched on May 5, 2003 This is the guest home pageFirst week was exciting, about 1000 users right off the bat, then tapered off

Signed-in member home pageVisual design done by Allen Single column layout (except for home pages), limited color palette, a few icons

Profile page; things to note: Profile is pretty sparse; no endorsements/recommendations (not until later that year) No education on Profile (not until mid-2004!)Search network through 4 degrees of separation BUT, no way to view (or contact) people outside your network at all (no nameless profiles, etc.) Introductions are the only communication tool; InMail comes later Invite by email address ONLY Wanted to ensure you really knew the people you were connecting to Lots of messaging on the site re: only connecting to people you know Didn't want to weaken the network No photos Coming from SN, we didn't want it to be a dating site Very cautious –> recurring theme throughout the early years No ads, no monetization whatsoever Token "beta" survey hinted at possible subs (way down the road)

Early example of game mechanics in connection icons (created by Allen) Little icon on profile/search results next to your # of connections Icon changed as you added more connections Never published those thresholds, users had to discover on their own Fun way to encourage connection building

Front-End: May 2003

• 70 JSP pages

• 20 JSP emails

• 4 JS files

• 1 CSS file

• Browsers: IE6/Win, IE5/Win, IE5/Mac

We were an all-Mac shop, only 1 PC in the office (located on the floor of a closet!)

End of 2003

1Developer

0Designers

100,000Users

End of year stats for 2003 Still no dedicated designer, aside from Allen (who was also PM, Customer Service, etc.)

2004

Site has undergone some changes Secondary navigation appears Multi-column layout “Add connections” link appears in the header (this is just one test)Growth starts to pick up significantly with address book uploads/invites Days in 2003 where we got 10-20 signups!Groups launched Very bare bones; badging only Groups created manually by WebDev (for the next couple years)Releasing new features weekly

Explaining how LinkedIn worked and how to get value out of it was probably our biggest issue back thenSpent a LOT of time on the new user experience in those days Constantly redesigning the new user home page; here’s one example

This is a homepage from mid-2004 Emphasizes address book uploads and searching your network Note the “Sponsored Links”: our first, teeny tiny crack at making money (run first through MarketBanker, then Adbrite)

Ches Wajda joins as LinkedIn’s first designer (this photo’s actually from his last day... captures a typical workday for him) Was a lead at eTrade Incredible illustrator; over time, he transformed the site completely...

Shortly after Ches came on board, we did a full redesign of the site Here’s the guest home page Note the tie-in with Kelly Perdew, who won Season 2 of the Apprentice that year; he had an LI profile and helped promote us (somewhat)

Here’s the member home page Note the header: we did a cobranding deal with American Express’s Small Business Network Anyone who signed up through it got that logo in their header We were really excited because it was going out to 1.5 small business members One of those things we spent a ton of time on to make work, and really didn’t net much in the end Part of the startup experience: throw a lot of stuff against the wall, trying to move the needle; some sticks, most doesn’t

End of 2004

1Developer

1Designer

1,600,000Users

2005

Jobs launches in early 2005. This is the job seeker homepage at the launch We’ve redesigned the global nav again; alternating blue tabs for the “find” and grey for “my” items Also a funky toggle used to go between the seeking/hiring areas of Jobs This header would basically endure (with slight variations and additions) until beginning of 2008 This was our first big push at monetization (although postings were free for the first couple months as we tried to build traction)Jobs was a tremendous amount of work for the whole team and, in particular, me Realized after pulling an all-nighter the night before the launch that I needed help Had about 7-8 engineers now feeding me work + Ches redesigning the site every 5 minutes

Made my first-ever hire, Scott Schlegel Nerve-wracking process; making that leap from individual contributor to “Mr. Manager” Still remember having lunch on Scott's first day and thinking "Man, I really hope this works out." Fortunately it did, better than I could have ever imagined Everybody knows how important hiring is, but the first couple people you hire on a team are important x 100 They end up setting the tone as much as you do yourself; you just can’t get those hires wrong

Around this time that Ches re-did the LinkedIn logo After many explorations, this is the final round of designs that Ches did Each exec was given three pennies to use as votes, they placed those pennies on the variation they liked best The one in the upper right is the one we use today

Continued to churn out new stuff Guest home page from mid-2005 We had also launched Services at this point Really just a page of links to different Service Provider searches (“lawyers in your network”, “accountants”, etc.) News mentions helped validate us and so were still very prominent

Here’s a member home page Getting a lot busier Global nav changes Find Services is now a tab Plus there’s a download link for one of our desktop tools, the JobsInsider

This is a weird feature we did called the Signature Creator Basically generated an HTML signature (including a LinkedIn profile link) that you could import into Outlook or other clients Another example of something we spent a ton of time on but, in the end, had little impact Schlegel pulled his first LinkedIn all-nighter for this project Some execs really loved this feature and thought it would boost our virality; it didn’t

Here’s a one-off page we did for an event our Sales/Marketing team was attending This page is long gone, but it inspired a parody that still lives on the site today...

The Togo’s page! There was a Togo’s about a half-block from our office on El Camino in MV (it’s since been torn down and replaced by a Walgreens) We probably went there 3-4 times a week. Sandwiches were good, the service was pretty horrible (we figured this out much later after going to another Togo’s that was 2x as fast) When we weren’t eating at Togo’s, we went to...

Sizzler! This was also a parody of another marketing/sales page; I can’t remember which one Picture of Greg Cervelli, one of our product managers, who held the record for most shrimp eaten (92 on the day of that photo) We didn’t actually eat at Sizzler often because, if we did, we’d be dead

Here’s the product team circa 2005 (Ches taking the photo) at Sizzler Allen and Josh Elman, another PM (now a principal at Greylock) on the right

Besides jobs, the other big product from 2005 was Subscriptions Huge release: really changed the way LI works Reduced network from 4 degrees to 3 degrees InMail is introduced; can get as part of a subscription or a la carte Name search across the entire user base (not just your network) Such a big release, we took the site down for six hours in the middle of the day While Eng worked, the Product team went to Malibu Grand Prix (true story) This is (pretty close to final) comp of the Member Home page from the time of the Subs launch As you can tell, we were redesigning the home page pretty much every 3-6 months in these early days Inbox is still very prominent (esp. here where the comp shows all the cases) Also the top text ad makes its first appearance (still there today)

Of course, we did take some breaks. Scooters were very popular; we had a large office that was half-empty, so we frequently had scooter races On the left, Scott’s jumping over Greg On the right, he’s taking off during a timed lapWe also organized wiffle ball games in the front parking lot (where we learned our high school-age summer receptionist was a ringer)

End of 2005

2Developers

1Designer

4,200,000Users

2006

Public Profiles First signficant LinkedIn content available to non-members Drove a lot of new signups via search engine traffic; huge boost to our numbers

We also created a LinkedIn Team page so we could boost the search ranking for our employees LinkedIn profiles It was a simple list of everyone who worked here, but we needed something else for the page I told Ches, we should say “these are the wizards who make LinkedIn happen” and have an appropriate graphicAnd so he drew a wizard That’s the first draft on left, final on rightWe used this on the Team page for years (as long as we had that page) Later, he appeared whenever we had scheduled downtime (which was frequently, nearly every release), which gave him a bad reputation He still lurks in dark corners of the site, spreading his magic where he is least expected...

Kept iterating on the site Here’s a guest home page from mid-2006 Note the search for public profiles, as well as the links to the public profile directories for SEO I think this is the first time “Relationships Matter” is used as a tag line

Here’s the member home page The top nav now includes a search box on every page “What’s going on in your network” is the first appearance of the Network Updates feed

Around this time that Ches decided even he needed some help, which lead to the arrival of... Mike Lin, aka Ultraman! Mike came from Yahoo, first in a long line of UED team members (designers and developers) we would import from the big Y The day Mike arrived was a very special one Not just because he was to become instrumental in shaping the direction of LinkedIn’s UI over the next few years But because we welcomed him with lunch at...

ARBYS! To be honest, I can’t remember WHY we took him to Arby’s; in retrospect, it was pretty far from the office (Sunnyvale)Arby’s was to become the scene of many...

Many...

Many...

Many New Hire lunches. In fact, every new hire lunch in UED from May 2006 to September 2010.

Brought the tradition to an end in September 2010 when we went for lunch on Mike’s last day at LinkedIn. Closing the circle, if you will. Keep in mind that everyone in this photo had lunch on their first day as a LinkedIn employee... at Arby’s.

After Mike arrived, we redesigned the profile Break out some content (recommendations, connections, messages) onto sub pages Add a big 300x250 ad slot

Part of redesign: a small Profile Completeness widget that superseded the old Profile Tips The % indicator suddenly made it exciting to fill out your profile in a way the old tips didn’t accomplish Became a classic game mechanic example on the web (still it referred to today, and many other sites have copied it)

Coincided with a revamp of the Services area This never really succeeded as we hoped (eventually removed from the site), but I did use it to find my current dentist (true story)

Around this time, we added two new members of the UED team...

Omar Lee Omar came from Tivo Another amazing illustrator and designer Replaced Ches, who had left for YouTube

Steve Ganz This is what he looked like when he joined LinkedInSent him an intro through my old boss at QS Turned me down initially, but then he came around Passionate about web standards, and was intrigued by our use of microformats/hResume Pivotal hire for WebDev, responsible for connecting us to many future hires Opened up PayPal to us: Jamie (who in turn, brought Scott O), Jeremy; also Travis Key lesson: Only thing better than hiring a great developer is hiring a great developer who knows lots of other great developers and can convince them to join him Also promoted our work in the WebDev community, conferences, etc.

Around this time, Guitar Herotook the UED team by storm Scott came into work one day and would not stop talking about how awesome it was We went to his apartment during a break in the afternoon and played I think we had a PS2 and Guitar Hero for the office within a day or twoGuitar Hero become such a big thing at LinkedIn that we had a company-wide tournament when Guitar Hero 2 was released And it was the centerpiece of our “World Tour” t-shirt at the end of 2006, designed by Omar

UED team photo, late 2006 L-R: Scott Schlegel, Omar Lee, Chris Saccheri, Mike Lin, Steve Ganz

End of 2006

3Developers

2Designers

8,000,000Users

2007

LinkedIn Answers Another feature we invested a lot of time in but didn’t quite pan out as we hoped (eventually removed from the site)

Redesigned the home page again around this time (widening the right rail for a big ad slot)

Continued to find ways to blow off steam from workSometime in 2006, Scott and I found a rubber ball in the office, took it out back and marked out a four square court It caught on pretty quickly; we’d send out a company email announcing four square and eventually people would trickle into the back parking lot Sometimes had to create two simultaneous games!

Eventually took on other startups (SimplyHired, Meebo) and were even featured on Fox Sports Bay Area This is a photo of us with our uniforms and personalized LinkedIn 4 square balls Headed over to SimplyHired to do some damage (and we did)

In 2007, we moved into Stierlin Court and kept the bullpen-style arrangement that kept us in close quarters Even built out a nice Italian restaurant for our cube warming/decorating contest Those are famous Italians on the wall (from DeVito to Sinatra)

This was a fun, UED-driven project to redesign the guest home page Worked closely with Reid on this, all of us in a room together brainstorming Yet another attempt at explaining the value of LinkedIn to new users (never stopped working on this) Really wanted something dynamic, even though it was before users had signed up Hit on the idea of getting their company/school names and using that to show how many people from those places were already on LinkedIn Didn’t really nail it, but it was a fun process and a rare opportunity to work directly with Reid on the design of a featureWas great that Reid clearly understood the value of design but, unfortunately, design wasn’t always part of the conversation at the exec level

Fortunately, there was a key hire for UED in 2007 who was neither a designer or developer who helped solve that problem... Adam Nash Led Product for home page, profile, and registration Also became the manager responsible for the web developers and designers Helped establish the UED team as a true unit In fact, it’s after he arrived that we started to refer to ourselves as UED Previously "the designers and WebDevs", "those jerks", "Benny and the Roids" Helped us manage up, advocate for importance of design at exec level

Why WebDev in Product?

• Better communication, better results

• Horizontal unity in a vertical world

• Recruiting advantage

Helped solidify WebDev's position in Product Starting in 2007, steady stream of Eng leaders came onboard wanting to bring WebDev into Engineering We resisted; the partnership with design was very important to us Felt it resulted in better work; people at both ends of the process (concept + execution) sat side-by-side, so you had checks/balances to see that features turned out the way we had originally conceived them "Horizontal unity in a vertical world" Company had begun splitting into vertical teams around Product areas We worked on those teams, but continued to work horizontally, too Easier for us to keep the site in sync that way (at least, with a small team) A recruiting advantage Web developers who care about UX want to work closely with designers Designers wanted to work closely with the person implementing their design Not that we had anything against Engineering; as web developers, we were close to them too But here, in UED, in Product, was where we felt we could produce the best resultsIt was an ongoing struggle and, if you like having a UED team that includes both design and development, thank folks like Adam and (later) SteveJ for helping preserve that

With our newfound identity, we doubled the size of the team in Summer of 07: Jamie hired Another PayPal hire Played Wii bowling with Jamie during his interview (hired despite numerous gutter balls...) Gina hired First in a loooong line of Yahoo web developers Lured her in with the promise of pony rides in our job description (finally fulfilled 4 years later) Brad hired Came from Shopping.com Craig hired Came from SimplyHired, still stinging from their defeat in Four Square Kate hired 1st design manager (now design director at FB) Helped grow the teamUnfortunately, Omar left soon after this But on his last day, we visited a place that would soon become another traditional UED restaurant...

Benihana! (This is a photo from Omar’s going-away lunch)

Like Arby’s, the UED team would make many trips to Benihana (including a Christmas party)

Here’s the team after lunch on May 19, 2011 (IPO day).

Home What is LinkedIn? Join Today Sign In

Over 30 million professionals use LinkedIn to

exchange information, ideas and opportunities

Stay informed about your contacts and industry

Find the people & knowledge you need to achieve yourgoals

Control your professional identity online

Join LinkedIn Today

Continue

Already on LinkedIn? Sign in.

Company Customer Service About LinkedIn Learning Center Blog Advertising Press Partners Careers

Tools Overview Outlook Toolbar Browser Toolbar JobsInsider Developers Polls

Products LinkedIn Answers LinkedIn Jobs LinkedIn Updates Company Directory

LinkedIn Corporation © 2009 User Agreement Privacy Policy Copyright Policy

Use of this site is subject to express terms of use, which prohibit commercial use of this site. By continuing past this page, you agree to abide by these terms.

First Name:

Last Name:

Email:

Go

People directory: A B C D E F G H I J K L M N O P Q R S T U V W X Y Z more

First Name Last NameSearch for someone by name:

Language

Closed out 2007 with another big redesign Here’s the guest home page, back to a more static design, but has reg form inline

Another revamp of the global navigation; adding a persistent side rail with profile information Menus on the top and side give quick access to all key areas Lasts until late 2009Redid the home page, too Still emphasizes the various ways to build your network Right modules prepare for launch of OpenSocial

End of 2007

5Developers

5Designers

17,000,000Users

End of year stats for 2007 Hired Sarah just before the end of the year to even out the score and keep the team in double-digits overall

2008and beyond...

Of course, the story doesn’t stop there...

And grow!

The team continued to grow...

And grow...

And grow...

And grow! (This is the team today.)

0

26

52

78

104

2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013

104

79

3829

1510

53211

Web Developers

Everyone at LinkedIn loves a curve that goes up and to the right. The WebDev team’s growth curve is no exception. (Design team is similar but don’t have the numbers. Sorry.)

Q&A

Open the floor to some Q&A on the history of LinkedIn, UED, WebDev, whatever.