Launched the winning design of the Web Design 2.0 contest

By Manuel Lemos

manuellemos.net

<email contact>

Contents

What is Web Design 2.0?

PHPClasses Design Award

Interview with the winners

What is Web Design 2.0?

A lot has been said about Web 2.0 since the expression was introduced in 2004 by Tim O'Reilly. So much, that nowadays many people are bit fed up of hearing about it.

Concerning this article, what matters is that one of their characteristics of Web 2.0 sites is that users are empowered to actively participate and be in the center of the attention. Users can do things that they like for the benefit of the whole community of users of the site.

Often users can contribute with content of interest of the site users. In some Web 2.0 sites, users can also vote on content contributed by other users to decide which submissions are more relevant.

In the case of the PHPClasses site, the users can submit packages of PHP components that may be useful to others. Users can also rate packages submitted by other users. The ratings are used to build top rated charts that are useful to help finding the most appreciated components for different purposes.

Web Design 2.0 is just an denomination that means it extends the user contribution aspect of Web 2.0 sites to the Web design of the sites themselves.

Web Design 2.0 is not about design style patterns adopted by Web 2.0 sites, but rather about letting the users propose new designs for the sites, letting the users preview how each proposed design will look like in real pages, and letting the users vote on the site design proposals that they like most.

PHPClasses Design Award

The PHPClasses site Design Award is an initiative created having in mind the Web Design 2.0 principles described above.

Let the users express themselves visually

The main motivation of the contest was to solve a problem: some users did not like the site design. The greatest challenge in addressing that problem was to understand what exactly the users did not like in the site design. Was it the layout? The color usage? The white spaces? The placement of advertising?

It was hard to understand the complaints. Most users that complained did not mention specifically what was wrong in their opinion, neither offered specific change suggestions.

Instead of trying to guess what they users were complaining about and try fix it, it seemed to be more objective to allow users with design skills and interest to help, to propose a new design. If it was hard for them to express with words what they did not like, let them express visually with HTML, CSS and graphics how do they like to see it.

The site design themes and the premium services

Allowing the users to create design themes so they can configure how they want to see the site, was not a new idea. In 2002 the site launched a survey about paid services. The purpose was to ask the users what kind of services they would be willing to pay as part of package of services to be provided exclusively to premium subscribers.

That was a crucial moment of the PHPClasses site. It was necessary to seek a source of revenue to keep the site open. The advertising market dried due to the burst of the dot-com bubble.

Fortunately, the Internet advertising market started regaining vitality in 2003. Since then advertising revenue kept the site financially viable for many years. Later in 2006 the PHPClasses finally got back to the original plan of the premium services. Most of the planned premium services were launched in 2007.

The idea to allow the users propose a new site designs was never made available as a benefit of premium subscribers. The main problem was that the whole idea required a non-trivial development effort. Nevertheless the site design editor effort was finally started in September 2008.

Was the design contest really worthy?

It took more than one year to make site design contest ready to launch. Some people asked if it was really necessary to spend so much time and effort developing the whole site design editor and proposal system. Some even asked if it would not be better to hire a professional designer to propose a new design.

The answer is that this was definitely necessary to do it right. The reason is that to address the recurring user complaints about the site design, somebody had to propose a design that would have more people accepting it than the users that could reject it.

For those that wonder whether that is really an important aspect, think about the redesign user rejection flops of Facebook and YouTube. Note that either Facebook and Google certainly hired the best professional designers that their money can buy. So the problem is not whether you hire or not a professional designer.

Actually, many of the participants of the PHPClasses site design are indeed very skilled professional designers. Despite most of the content of the PHPClasses site is submitted by Web developers, the site is visited by many professional Web designers too.

The approach of the PHPClasses site was decided prior those redesign user rejection flops mentioned above. The idea was to make this a democratic process. Everybody can propose new designs, everybody can test the new designs in real pages, and everybody can vote on the new designs.

The most voted design is picked. If none of the candidates gets 50% of the votes, a second turn takes place to decide between the two most voted. This way we practically eliminate the chance of having more concerned users rejecting the picked design than those that accepted it.

The results are here as you may see. If for some reason you did not like the results, providing a way for the users override the elected design is being considered as an option to be made available to premium subscribers, as in the original premium services plan. Lets see if is there a real demand for that.

The redesign effort is never finished

It seems that after all the design contest really went well. From the over 600 users tried the site design editor, 34 users submitted design proposals that were voted in the election.

Most of the proposals were submitted in the last weeks of the contest submission period. This was a bit worrying because the contest was announced more than one year before the election started. Several blog articles were posted during that year but the user feedback was scarce. I was hard to tell whether the users were not interested or all seemed OK for them.

Only after the submission period ended and the voting period started, some complaints were posted about the way the contest was organized. It was a bit too late to complain.

This was the first edition of the contest. No other contest like this seemed to have happened before. Aspects that did not went well were expected. We just could not guess in advance what those aspects would be.

In the future there will be other editions of the design contest. Things will be improved based on the lessons learned about the things did not went so well. There will be a time for reflection about those things.

Meanwhile there are certain aspects that we already know that will certainly be addressed in future editions. This edition of the contest was focused only on redesigning the headers and footers of the site pages, the CSS styles and the site icons. Future editions of the contest will allow designers to change the templates of the most common types of site pages.

Improving the winner design

One aspect that was left out of this edition was the site logo images. This was meant to be subject of a future edition of the contest. However, the winners of this edition proposed to also change the site logo after the final contest results were announced because the original logo did not look very consistent with their site design theme. The argument was accepted and they also proposed a new site logo.

Other problems were detected with the winning design after it was tried in other types of pages besides those that were available for testing within the site editor. This required an additional effort to fix those issues one by one.

This was hard because the winning authors did not have much time to spare after their current work hours. That is the reason why it took so long to launch their design. Hopefully the wait was worthy.

Interview with the winners

The second turn finalists of the contest were invited for an interview so they can share about their experience with the contest. Ifat Amit is the lead designer of IntergraphicsDesigns. Rica

Legend:

PC: PHPClasses (Manuel Lemos)
IA: Ifat Amit (lead designer at InterGraphicDESIGNS)
RA: Ricardo Acre (director at InterGraphicDESIGNS)
GR: Guilherme Ribas


PC: First, please tell us a bit about yourselves, where do you live, how old are you and where do you work.

IA: I live in Costa Rica and I am 26 years old. Currently I work in Intergraphic Designs as lead web designer/developer. Also I work for a local university (Universidad Creativa) as teacher and "Web Sites Development" career director.


RA: Hi, I am a proud citizen of Costa Rica, 28 years old, and working since 2004 at InterGraphicDESIGNS (@igdonline), I have worked for IGD as entrepreneur, PHP developer, Web Strategist and Project Manager. I have worked also for Universidad Creativa creating the "Web Sites Development" Career (2008-2009).

I enjoy also being recently a volunteer for PulsoSocial.com (@pulsosocial) writing some articles in Spanish about Web Design, Social Media and other subjects.


GR: I am 26 years old and I live in Curitiba, the capital of Paraná, in south Brazil. In 1995, when I was 11, I got my first experience surfing the Internet and since then I got fascinated about it, so I immediately started studying how sites were made.

In 1996 I could easily create a design and turn it into HTML. In 1998 I had my first experience with PHP and I realized I was ready to work developing Web sites. Since that time I work as a freelancer developing Web sites and Web applications. Since early 2007 up to now I also work in an online shopping, called Tradepar Shopping, with a Brazilian, European and North-american versions.



PC: One of the purposes of this interview is to give you some exposure to your work. Has the exposure that the contest gave you so far benefit you already? Do you think that it will benefit your future careers?

IA: It will definitely impact our careers since it might be the website with the largest exposure I have the chance to work on so far. I think this could open opportunities to work for even bigger communities and companies.

RA: For sure, PHPClasses.org is a high traffic project and well-known for all the PHP Community, the fact to mention this experience as part of our experience at InterGraphicDESIGNS give our clients a lot of trust in our work. This is the most visited website we have worked for since 2002.

GR: Yes it did. I already had one contact for a website development and lots of people from the PHP community got in touch as well. It certainly will benefit my future career because PHP Classes is a great reference when talking about PHP.


PC: Besides the exposure and prizes that you earned, what other things did you like about the whole initiative?

IA: It was fun to see  so many proposals for the same web site design by so many people around the world and the community to be able to point out what they thought about the designs.

RA: Yeah, the elePHPants and sponsor prizes are so cool (Ifat will enjoy it a lot), but I think most important thing here is that we worked for this important project that has been so relevant for so many people in the PHP world, PHPClasses.org has been built with the community knowledge and the best way to create this new theme was giving the same community the opportunity to propose everything we want and making this interesting contest. The contest was interesting, we receive a lot of feedback, all kinds of comments, and the final turn was so close, it was cool.

IA: I will enjoy the elePHPant :)

GR: First I would like to say that I was pleased to have the chance to contribute with the community. It was a great idea to let the users design their own themes and also to let the users vote on the one they liked better. It was nice talking to the users and even nicer to see that people really wanted to make the site even better. The PHP community has a lot of great professionals and friendly people.


PC: This is the first edition of the contest. Some things may not have gone the way some people wanted. What things you did not like so much? How would you suggest that it is improved in future editions of the contest?

IA: It might be good to be able to change the HTML structure more so innovation can be made and improve the user experience. In this contest the editor made difficult the process but we understand why so.

RA: Well, we understand this was the first edition of the contest, in this opportunity the work of the participants was focused in the CSS file through the own PHPClasses editor and the editing of some images and icons.

It would be great if PHPClasses.org totally opens the way the participants suggest the new themes thinking in a totally new website for future (just sending a JPG of how they imagine the new PHPClasses.org). We know it could means a lot of work to match the system needs to any graphic design people suggest, but well, maybe some opportunity like that one could give a lot more of ideas than working with the actual CSS editor.

PC: The problem of sending just a picture of a planned design is that it may be unrealistic and very different from what the users end seeing when it converts to HTML. The current design system allows users to try the proposed designs in different pages. A static preview image would not allow that possibility.

RA: Yes, we understand and agree about it

GR: Lots of people complained because they didn't really figured out how the editor worked and some people also didn't understand what was the real purpose of the contest. As some other users, I think it would be nice to have the chance to edit the internal pages as well, but it would take ages to create the tool and to validate all the entries. So I do think it will be even better in a second contest.

IA: It would be better if the designer can modify more the HTML and the pages separately

PC: Right, that is definitely in the plans for a future edition.

IA: And the images sizes and formats should be customizable.

PC: Yes, in the future all icon images will me migrated to the PNG format. So far the GIF format was used because Internet Explorer 6 does not support PNG transparency without hacks. Since the PHPClasses site audience using Internet Explorer 6 is less than 4%, the number of people affected by the lack of transparent PNG support in Internet Explorer 6 is no longer enough to advise against the move to PNG.


PC: Are you available to take requests to do design work for other companies that may be interested? If so, how can they contact you?

RA:: Absolutely, our Web site has all our information, project portfolio, and all the information related with our services of graphic design, Web design, multimedia, SEO and SMO. We also suggest people to follow us on Twitter. There are active accounts also on Flickr, Facebook, DeviantArt and more. PHP developers, web designers and all people interested in our services can check all this links at our Web site. We work from Costa Rica and we have experience working for clients in other countries in Latin America, United States and Spain among others.

GR: Yes I am. Just send me an e-mail at ghribas at gmail.com (also Gtalk), or Skype me at gui.ribas.

IA: Yes, my email is ifat at igdonline.com


PC: Was there any other question you would like to be asked, or maybe anything else you would like to say?

GR: I thank all the people who dedicated their time to participate the contest. It was great to see most of the users were respectful and friendly.

RA: I just want to say thanks to give us the opportunity to participate in this contest and give us some lines in this blog to tell about this experience. We also appreciate a lot all the feedback we received from users around the world, specially all the nice messages from the Costa Rica PHP Group.

We hope the new theme give a better user experience. We also want to send our congratulations to Guilherme, he did a great job. We joke about Brazilians always defeat us in soccer, so, it was time to bring some victory for Costa Rica, I hope it happens in soccer someday also =D. We enjoy to participate in the contest and now we hope all the users enjoy this new theme.

IA: It was a different experience and i want thank you for the opportunity.

PC: Thank you all for your participation. I hope to see you again in future editions of the contest.


Feel free to post a comment to this article if you would like to give your opinion about this contest and the new design.