How I launched flickrup.com in less than two weeks
Flickrup allows people to submit flickr photos and vote on them.
The idea with Flickrup! was to launch a working, stable site as fast as possible. The idea I had when I started working on the site was to be as minimalist as possible in regards to design, code complexity (frontend and backend), db schema design and user authentication to name a few. I also wanted it to be ridiculously easy to submit and vote on photos. So here are some of the things I did.
frontend design:
I used a css framework (blueprint) to assist in creating a grid based layout and also utilized all the predefined styles for elements. Instead of creating my own css classes and ending up with a cluttered mess, I forced my self to use the classes defined in blueprint as often as possible.
I didn't waste time making a logo. The logo is simply a text link to the frontpage.
I didn't clutter the frontpage with flashy css based buttons and login/signup links everywhere. Instead, when someone hovers over a vote link, a css popup comes up which allows them to vote anonymously or using the flickr account.
I didn't waste time setting up a blog for the site.
backend design:
No brainer: I used a well known php framework (codeigniter) and forced myself to use as many classes and helpers they had to offer including: (pagination, session control, url helper, captcha, date helper)
I had a problem that needed some solvin' and I was greatly tempted to roll my own solution, but I searched until I found an already existing one.
Database:
I have four tables. That's it. Photos, sessions, users and votes.
Authentication:
There isn't an ugly login/signup link to be found on the frontpage and it doesn't need one. Logging in is inconspicuously placed in the flow of voting and submitting.
You don't have to sign up to use the service. You can vote and submit anonymously. It's true that you can vote for a photo as many times as you want as an anonymous user, but so what? If someone wants to spend their precious time painstakingly figuring out the captcha a dozen times to fluf their votes, who cares?
Must look into blueprint, CSS frameworks seem to be the way to go.
Well done
But, a serious question in regards to how you implemented it. Isn't that how you would usually go about implementing something?
As in, the rule of thumb is: think of the least functionality needed to launch a first version, use a CSS framework to avoid writing your own, use a JS framework to avoid writing your own, start up with a simple design, use some kind of code framework to avoid re-implementing common functionality such as authentication and caching..., and so on....
After testing the water with that, you can start replacing stuff if needed, hiring a designer for a more fancy look and the like...
In regards to design, people spend a lot of time creating photoshop mockups, then modeling it with css and html. I'm just saying, if you want to get it done quickly, just skip all that and keep it minimal.
http://pr0digy.com/codeigniter/benchmark-static-cake-codeign...
It looks nice.
So Yahoo will have to ask you to change your domain to something else, right?
http://developer.yahoo.com/yui/base/ http://developer.yahoo.com/yui/reset/ http://developer.yahoo.com/yui/grids/ http://developer.yahoo.com/yui/fonts/
They reset the browsers setting, e.g., setting body, div, span's margins and padding to zero.
They setup the typography, picking a global font, setting up font-sizes, margins and padding for html elements such as h1, p, ordered and unored list, etc...
They provide a way of setting up a grid. Blueprint, by default, uses a grid chunked into 40px segments, creating 940px wide design. You then place divs inline or nested to create your design.
Blueprint also provides some extra goodies like defining styles for forms, error and success styles for divs, and some ie fixes.