Having spent many years working at ESPN.com, and now with Sports Technologies, the NCAA Tournament has always been a high point of the year for me (or at least one of the busiest).
This year I developed the Hoops Bracket Challenge game for SIKids.com. Much of the game reused elements of the bracket game I produced last year for SI.com, but there were improvements made along the way. I was especially happy with the interface for filling out your bracket which used a css / javascript “sliding window” technique. The game was converted from Oracle to MySQL which was not much of an issue using Ruby on Rails database migrations.
Now if I could only pick games. I didn’t do so well selecting my picks for this year’s tournament.
This week I launched the Dan Patrick Weekly Challenge pick’em game on FanNation.com. It is a similar game to others I have developed recently. One new thing is groups that are specific to the game (instead of FanNation groups) and the ability for users to join multiple groups.
The interface is laid out using absolute positioning, and uses javascript to set hidden form fields when a user clicks on the option they pick to win, an then updates the css class to set the background image on the element to indicate which option is selected. With this application I built some admin pages where the producer of the Dan Patrick show can enter the matchups and set the winners. The designer at SI cuts logos or images to go with each matchup, so there are input fields for the image URLs as well.
This is a pretty simple game that could be reskinned to let users pick any type of matchups. Our Sports Technologies web site has been updated recently.
My latest project that I devoped for FanNation / SI.com is the Seth Davis Bracket Challenge for the NCAA Tournament. To date this project has probably been my most complex Ruby on Rails application. I was also really happy with how the interface for picking your bracket turned out. It is all html, css, and javascript based (as opposed to ESPN’s Flash interface for picking teams).
I used a sliding window effect where a div with smaller dimensions set to overflow hidden wrap a div with a greater height and width. After the user saves a region via Ajax, I used the scriptaculous Effect.Move function to animate the screen moving to the next region.
Some of the challenges I was faced in this application included clearing out downstream picks if you changed a team in a earlier round that you had advancing farther down the bracket, and displaying pick percentages for each team at each round as you are making picks.
To solve the first issue I set a javacript array that included all the match ids and match position (top or bottom) that were downstream of every match, and when a user clicks a team to select the pick I checked if the opponent in that match was already selected in a position down the bracket and cleared it out.
To dynamically display the pick percentages as you move a team, I printed out a javascript array (actually a JSON object) that listed every team id, and an hash of each percentage ar each round when the page is loaded. Then when the user clickes on a team to advance it, I cloned the innerHTML of the div they were selecting and replaced the innerHTML of the percentage div with the percentage of that team for the next round.
After all the work I put into this, it’s too bad that the interface is only viewable for four days to the users until the game locks before the tournament begins. Hopefully we will make use of the code for next year’s bracket or some other fantasy games we build in the future.
Published by Brent December 12, 2007
in Work.
The last few weeks I been very busy building the College Football Bowl Pick’em game for FanNation.com. On Monday I even pulled an all nighter in order to wrap things up for the launch deadline. It is always exciting to release a new web app into the wild! The game was fun to build as I continue to get more comfortable with Ruby on Rails. I keep learning more with every new project. The Bowl Pick’em game is a “confidence” game where you sort your picks and get more points for the game you have ranked higher if you get the pick correct. Sign up now to play the game! The game locks on December 31st at 12:25 pm, just before the start of the first bowl game. Join the group Friends of Brent to see how we stack up.
A few weeks ago now, I left my job at ESPN.com to join Sports Technologies Inc. based in Collinsville, Connecticut. The first few weeks I have been working on FanNation.com which is a sports social networking site owned by Sports Illustrated. STI also just launched NBCOlympics.com. I started a blog on the site called U.S. Cycling Team Outlook where I will post updates on how the U.S. Olympic cycling team is shaping up. I am really excited about using Ruby on Rails and being able to continue working on community driven web applications.
I was at ESPN.com for over seven years and I will certainly miss working with a lot of great people there. I was able to work on some really fun and challenging features there, and It was always cool to tell people you worked for ESPN. It was just time for a change and I am really excited about what is ahead for me at STI.
Mickey and Minnie were in the ESPN cafeteria yesterday …
ESPN released MyESPN to the public last week. It is a customizable page similar to MyYahoo, Google IG, or Netvibes. For sports fans who would like to have a personalized start page, MyESPN should be just what you are looking for. Hundreds of ESPN content modules can easily be added the your page, and moved around so you can order your information the way you want it. You can add many customized themes (many team colors are available), and even create new tabs to add even more organization to get the news they way you want it. Being a cycling fan, I added a tab just for cycling news, and added as many cycling related RSS feeds as I could find.
Today I had the priviledge of hearing Lou Holtz speak to our team at ESPN.com. He was very motivational. He had a lot of funny stories from coaching, but related his experiences to how to be successful in life and business.
Some of the basic themes he brought up were: You are getting better or worse, so you always have to look for ways to improve. You can’t rest of past success. You need to look a what your audience wants. He used an example of the railroads. What people need is to get from one place to another. If something better comes along that better meets their needs (like the airplane) they will use it, so you need to think of new ways to innovate. He talked about when you are on top, your competitors will look copy your strengths and try to exploit your weaknesses.
He talked about what makes a successful person. You need to set goals, and find something that you are passionate about. One thing he said that I could relate to was about how to be productive. He used the acronym WIN. What Is Next? Ask yourself 25 times a day “What is next?” Always be looking to the next task to get you to your goal. This really relates to a couple of other books I have been reading about getting productive. Instead of thinking about the big overwhelming project, break things down into the next thing you can do, and you will build momentum.
He talked about how important it is to be a person that people can trust. He said when he gets ready to go on the air to do analysis for an ESPN football game, he thinks about the responsibility to everyone who works at ESPN to do his best. If he does a bad job it could effect everybody else who works there.
Another mark of a successful person is if that person cares about other people. His words, along with some other things I have read recently just reminded that relationships are so important. Overall, I really enjoyed hearing him talk.
