Prototype Iteration 6

Events happening in the community are now at Drupal community events on www.drupal.org.
Mark Boulton's picture

Hi,

Following on from last week's call for feedback on iteration 5 of the prototype ... we have now progressed to iteration 6, whereby we have begun to integrate the visual design into the prototype, making the prototype feel more like a website now and less like wireframes.

We encourage you to browse through the prototype and feedback your thoughts and ideas in this thread. The link to the latest iteration is below (please note the slight change in URL - this is because of a new version of Blueprint, and additions to CSS etc.):

http://drupal.markboultondesign.com/visual/iteration6

Key points on this iteration:

  • If you've viewed the prototype before please dump your cache or things may look a little screwy.
  • Applied visual design concepts to prototype (disclaimer: This is the 3rd iteration - things will be changed, and things will get better. Also, ignore the CSS and semantics of the HTML - this is all currently based on Blueprint.)
  • Added new logotype (rationale forthcoming on a blog post on the MBD site, which you can read in Planet Drupal, but also a post here)
  • Amends to several section, including moving logged in homepage to 'Dashboard' (name tbc)
  • Revisions to Documentation
  • Major changes to homepage to include revised copywriting

On the initial schedule, this was due to be the last week for community feedback, but due to the overwhelming and undeniably useful response, we have added 3 more dates for your feedback.

Don't forget to keep browsing the Flickr group (http://flickr.com/groups/drupalredesign/), and if you aren't doing so already, there is still plenty of time to follow the redesign on Twitter (http://twitter.com/drupalredesign)

We hope you are as excited about these developments as we are.

Thanks again.

Mark

(www.markboultondesign.com)

Comments

This looks really good

deviantintegral's picture

This looks really good, and feels good to use. Having many of the links work now makes it easy to click around to get a feel of the site.

My only comment is that the two-tone green buttons seem hard to read. The line in the middle of each word just doesn't work for me.

Keep it up!

--Andrew

I love the "splash as

gdemet's picture

I love the "splash as asterisk" in this current round!

I noticed the API-specific

drumm's picture

I noticed the API-specific search is gone. I was thinking of doing some enhancements for that. Such as better/faster autocomplete and full-text results. I fully-agree that API should be integrated into sitewide results. I don't have hard numbers, the search redirects to the correct page if there is an exact match, but I think developers use the search field on api.drupal.org a lot.

Agreed. Perhaps just an

brenda003's picture

Agreed. Perhaps just an oversight. Definitely can't live without the API specific search.

revisions to documentation

emmajane's picture

I've been a bit out of touch (and haven't seen previous versions), and I've only looked at the docs section in detail, but.....I think we can do better for the documentation section. I am interested in seeing a topical approach to documentation instead of a format approach. I don't like tabs distinguishing between Documentation/Videos/API/Books/Knowledge Base. (And to be honest the knowledge base just scares me as a documentation maintainer. I see it as onemoreplace to lose content.)

Instead of thinking the scary thought of how to restructure 1400 pages of documentation, I would like to start thinking about adding filters to highlight the best of the best. In the redesign flickr pool I added two photos that have a completely different approach to online documentation:
http://flickr.com/photos/emmajane/2987879578/
http://flickr.com/photos/emmajane/2987879572/

The idea is not to have everything available from the "topic" home page, but rather a view into what's beneath the surface. I will quickly become blind to static text and revert to using search to find anything. In the current mockup it feels as though the entire entry page is static. There is nothing to draw me in and inspire me to follow the links. But if each topic had a "feature" video/tutorial/snippet. If we could flag information for beginner/intermediate/advanced (please don't ask me to define those levels, I have no idea what they are). If we could show new pages and popular pages. If we could show that, unlike dead tree media, this documentation is alive and vibrant and worthy of reading (and worthy of your contributions) that would be exciting.

There are more thoughts over in http://groups.drupal.org/node/15965 as well. I look forward to hearing what other people have to think about this too!

right on the money

mike stewart's picture

I agreed in my gut, but didn't have anything to add until I saw your second link: http://flickr.com/photos/emmajane/2987879572/

I think there's much to be learned about why wikipedia is so successful in sharing information. we should imitate if we really want docs to be helpful.

--
mike stewart { twitter: @MediaDoneRight | IRC nick: mike stewart }

Feedback

dries's picture

This is starting to look really great! :)

Some companies provide 'commercial services' that are not ‘professional services’. See http://drupal.markboultondesign.com/visual/iteration6/professionalservic....

  • Acquia (my company) provides commercial support using a subscription model like RedHat.
  • Bryght, WorkHabit, etc provide specialized hosting services.
  • GoDaddy provides regular hosting services.
  • Lullabot provides training services, Drupal workshops, Drupal conferences.
  • Lynda.com provides commercial screencasts.
  • Mollom (my company) provides spam blocking and content moderation services (i.e. an electronic service with a subscription model).

It is not clear to me where these companies could live. The "professional services" page doesn't seem to support them.

A big company like SonyBMG might not going to post a topic in that services list; it looks too much like a "small consulting tasks list" and does not provide what they are looking for. SonyBMG, for example, has an internal engineering team and as such they have different needs -- they are looking for hosting, training or commercial support. They are not looking to post a small job. The current "professional services" page probably doesn't match the expectations of an enterprise user like SonyBMG.

Routing people to hosting solutions, commercial support, training classes, books is important -- it helps users succeed and provides credibility to the Drupal project. I'd like to see us improve http://drupal.markboultondesign.com/visual/iteration6/professionalservic... so that it also appeals to the enterprise user, and that it is more than just a listing of small consulting tasks. Maybe we should add some enterprise users to the testing and validation process?

Building a successful, commercial ecosystem around Drupal is key -- we have one today, but let's make sure that we don't leave out the hosting companies, support companies, electronic services companies. If we can't build an ecosystem that is "complete", we're not setup for success. I don't think we currently speak to enterprise users like SonyBMG.

I'm not saying we should list every hosting company on the planet, nor that we should list them for free. Just saying that there probably are companies that we want to list to make sure people can succeed with Drupal.

Renaming "Professional

earnie@drupal.org's picture

Renaming "Professional services" to something else might help?

Consumer services
Professional and commercial services
Hosting, education, professional and commercial services

i think the 'professional

rogerpfaff's picture

i think the 'professional services' is named good. but there should be some more diversification about the board to ask for services and some overview over companies which offering services as you listed them. perhaps there could be another level inserted that separates 'searching for service' and 'companies offering services'.

the board as shown here is more a substitution for the wide spread issue and forum threads were people ask to make minor changes at some modules or themes etc and it is very ok. but the real commercials should have an own space though i think it has to be under the professional services.

edit: the point that must be clear is that professional service are worth to be paid for.


Remember: I compute you!

the point that must be clear

earnie@drupal.org's picture

the point that must be clear is that professional service are worth to be paid for.

This is why "Consumer services" would be a better choice. It gives a connotation that I must give something to get some service in return. Another term that might be good is "Marketplace".

Another idea I have is to have a Services page that might list groups.drupal.org, drupal.org/projects, Professional services, etc. This would give good direction to information and guide the user to more of what they had in mind. I'm not being very coherent at the moment but I hope you get the idea.

Would a company like SonyBMG

rogerpfaff's picture

Would a company like SonyBMG to stay with the example find themselves in consumer services?

I think it might be good to have the paid services (naming alternative?or 'Not so free services' ;) ) mentioned also in the support section.


Remember: I compute you!

I think the "Professional

deviantintegral's picture

I think the "Professional Services" list is great for small, one-off contracting jobs. I could see large enterprises using it to post jobs, but not to find services.

I think this stems from the fact that Drupal.org is entirely user-based, and not group based. For example, I can use my user profile page as a little area to advertise myself. I can promote the modules I work on, the sites I've done, the services I provide, and so on. It's great for "me as the contractor". But as soon as you get to be larger than 1 person, the model breaks down. If a company could have a single page either on d.o or g.d.o, not tied to a specific user, they could then categorize themselves in terms of the services they provide. Then, you could have two lists - one of what is essentially contracting jobs, and another which are Drupal-focused companies.

As is, I don't see a way using the page to find Drupal shops near my location, or even in my country. Or, how do I see what modules have been contributed by what companies? When looking to hire, seeing that "Acquia contributed x modules and y themes, and sponsors core development" would be very useful.

The biggest issue I see is that while such a listing should be open to everyone, it could get way too large due to everyone filling in a company page, even if they aren't serious. Though I'm sure that's a problem that could be fixed.

merge professional services with jobs

catch's picture

We have a wide range of stuff from 'fix my css for $50' to 'full time Drupal developer needed in New Zealand' to Acquia, lullabot etc. I'd like to see 'jobs' and 'professional services' merged into one site which deals with all 'doing Drupal stuff for money' in a single place. Moving to more of a classifieds listing with tagging, as opposed to jobs vs. bounties vs. in quite static listings would help a lot with this.

Another thing I noticed is that jobs are very much tied to location - whereas 100% of my Drupal work so far has been remote, and I've only ever met a client in person once so far - and that was really only because I happened to live in the same city rather than a requirement. While some job postings are for people to work in a specific location, a lot aren't, and that's missing from the jobs board.

Services

dgeilhufe@yahoo.com's picture

I would suggest just "Services." Below that can come the full evolving and changing commercial ecology of Drupal.

Contributor vs. Community Member vs. Anyone
I think it is key that everyone in the Drupal community be "branded" according to what and how much they give back. The concept of buying a bigger listing for money is probably not a good strategy of building the Drupal community. Buying a bigger listing through code commits or maintaining an install profile would build the community.

But most important, casual Drupal users are reminded every time they visit the site that contribution is encouraged. Not everyone will be webchick, but
they can do something.

Specific suggestions for the design:
(1) Professional Services - change to just services
(2) Professional Services - add two categories:
Community (Contributor - Member - Listing) Contributor for folks that are key to Drupal community, Member for folks that are good citizens, Listing for everybody else) The association could make those decisions once per year.
Money (Featured - Listing) Allow people to buy featured listings
(3) Professional Services - Change the default tab row to contributor - member - listing which reminds everyone that community is important.

Big vs. Small
The design should put the big (Acquia, big consulting shops, etc.) on the same level as the small. Sure the big commercial ventures are really important, but they shouldn't squeeze out the single person you can hire to do a site for a grand.

Specific suggestions for the design:
(1) Link to the Services forum if that will still exist (better yet, a block displaying last five posts)
(2) Action link somewhere.... request services (link to create a forum post in the services forum)

Big versus small

dries's picture

Big vs. Small -- The design should put the big (Acquia, big consulting shops, etc.) on the same level as the small. Sure the big commercial ventures are really important, but they shouldn't squeeze out the single person you can hire to do a site for a grand.

I agree that the bigger ventures shouldn't squeeze out the single person shops, but at the same time, the single person shops shouldn't squeeze out the bigger ventures (like they do in design iteration #6).

The bottom line is that we need to grow both the number of small and big ventures if we want Drupal to be succeed. The world needs both. Making sure everyone gets the visibility they need to sustain, is key.

I also agree that people and companies that help make Drupal a success by giving back should be able to showcase their contributions. Drupal.org should encourage community building. Maybe there needs to be company profiles in addition to user profiles? Then, user profiles could be linked to company profiles, and company profiles would should the aggregate contributions of all the individuals?

company profiles

gábor hojtsy's picture

Company profiles and linking companies to attendees is something the Drupalcon DC site introduced this year. For example:

http://dc2009.drupalcon.org/sponsor/trellon
http://dc2009.drupalcon.org/sponsor/acquia
http://dc2009.drupalcon.org/sponsor/lullabot

Etc. People are also linked to their companies prominently: http://dc2009.drupalcon.org/user/gábor-hojtsy

Different purposes

laura s's picture

I feel that Dries has a point here, in that all jobs are not the same. There is a current listing of professional firms, all listed on an equal basis -- or as equal as alphabetical can get. Just tossing that out seems to me not only unnecessary but ill-advised. Yes, some people will want to just post their RFP on a forum and get replies from freelancers and small shops, but the clients looking for larger projects don't post their RFPs like that, typically.

If we mashup all freelancers and shops large and small all together into one laundry list, you end up reducing the visibility of all, and make it harder for the service consumers to find what they are looking for.

This area also provides an opportunity for advertising. Paid premium listings, for example (a la Google search listings). Display ads in the sidebars.

Linking from this area to case studies would also help encourage more shops to write them up, as a way of getting some exposure.

Right now, in Iteration 7, we still have just a discussion forum, and that to my mind is close to total fail in terms of meeting anybody's needs.


Laura
pingVision, LLC (we're hiring)

Laura Scott
PINGV | Strategy • Design • Drupal Development

Lets just call them all

Nick Lewis's picture

Lets just call them all "services". What makes a "professional" is in the eye of the beholder.

Underneath services I think there's a dividing line between:
1. Consultants -- what they do could be anything from small websites, to drupal performance. Perhaps it deserves its own sub category so that people can sort through the sea of names.
2. Web Design Firms (e.g. advomatic.com) -- usually includes development, graphic design, content development, and project management -- and a much different price tag.
3. Commercial Services (almost wanna say "Enterprise"... if not here... somewhere... ) and Support
4. Training
5. "recommended hosts"*

Notes
*Hosts that meet a recommended standard (this is my personal opinion):
- PHP 5
- MYSQL 4+
- Access to the shell (for christs sake, i'm going to shoot someone if I have to use dreamweaver as version control....)
- mod rewrite
- configurable php.ini files that allow users to bump up memory limits to at least 32 (i really prefer 96 for imagecache), or set max executation times, or size of allowed file uploads.
- .htaccess files actually do something....


"I'm not concerned about all hell breaking loose, but that a PART of hell will break loose... it'll be much harder to detect." - George Carlin
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Themes?

dmitrig01's picture

Can we have a themes page?

Drupal trademark message

dries's picture

The Drupal trademark message should be added somewhere -- the trademark message was added to the current drupal.org footer based on a recommendation from my lawyer (after some trademark woos).

Thanks!

Mark Boulton's picture

Noted :)

Module Page

jbrauer's picture

In general this is looking great. One page that strikes me as not working as well as the others is the individual module page.

Looking at the specific module page (12.1.1) a few comments:

The information in the middle of the page seems like it could better be summarized elsewhere. Perhaps it's a hold-over from the current design but having tags and maintainers in the middle of the page seems to break the flow. It would seem to fit better in the right-hand sidebar, perhaps just under the module rating area.

The "Join Group" isn't clear that it is a module-specific group. Incidentally I'm far from convinced a per-module group would be a good idea.

--
Blog: Adding Understanding | Drupal Developer Search

Module page

dries's picture
  • I agree that the module page feels a bit messy: it has a lot of text and it doesn't seem all the needed functionality; e.g. where do I report a bug? where do I browse the source code? where does one add a maintainer? Maybe it is better to use a tab-ed approach like Wordpress.org? See http://wordpress.org/extend/plugins/wp-mollom/ for example.

  • With the current design, I'm pretty sure that people would start reporting bugs in the reviews as well as asking for support in the reviews. I think we should be a lot more explicit about all of the possible actions: (i) request feature, (ii) report bug, (iii) write review, etc.

  • While I do like reviews, I think it lends itself to chaos and low-quality content (e.g. support questions, feature requests, bug reports, factual errors, outdated content). I'd like to see a mockup where we have 20+ reviews on a single module.

Not Recommended

jbrauer's picture

Putting the "Not Recommended" tag on the development releases begs the question why they are there to begin with. If I'm new to Drupal then coming to the main site and seeing a bunch of "Not Recommended" releases on the official release pages would be disconcerting. Something along the lines of "For development use" or just saying nothing (as the site does today) seems better. Might even be good to have the development releases collapsed on the page so they are an extra click away?

--
Blog: Adding Understanding

Search results can be richer

robertdouglass's picture

There are nice blocks on the search results page for popular searches and recent searches. There are also nice sub-searches as tabs. I like both ideas. Here are some other ideas that we're able to implement that would be very helpful to people:

  • sort search results (title, date, author, type, relevancy)
  • filter by site (we want to have all *.d.o sites in one index)
  • filter by author
  • filter by content type
  • filter by taxonomy term name

In addition, it would be nice to show a "Your current search" block. If you had searched for "image module", then limited it to forum topics on Drupal.org, then sorted by date, all of those things should show up in the current search block along with a link to undo that bit (ie take away the filter by forum topic).

Also...

robertdouglass's picture

If there are images or attached files on the search results we can show thumbnails of the images and little icons (pdf, word, odf) for the attached documents.

Homepage - where does the

brenda003's picture

Homepage - where does the "sticky" posts go, such as security releases? The "Drupal News" section seems to low for these sorts of announcements.

Looks great!

Noyz's picture

Tremendous effort.

Its so much better that I feel guilty surfacing issues, but I think that's what you're looking for, so here's a couple points to ponder:

On the getting started page, I'd like to see the installation profile thumbnails shown on Download and Extend. Bulleted text will be easily overlooked. Those are so powerful for new users. Modules are not task based, and therefor it's a burden to know which modules coupled together create which tasks. The thumbnails really helped bridge this gap.

As a secondary thought, I'm not certain if I'll be installing Drupal with an installation profile, or if I'll have to apply an installation profile after I install Drupal? I believe its the former, and if so, maybe the default install is an installation profile? Just a thought. In general I think this could be made more clear.

On the homepage, I find it confusing to provide a link to "download Drupal" underneath the Get Started section, then pair it next to a section called Get the Full Drupal. I think the Get the Full Drupal is trying to help the audience know how large community is, so maybe it's title could be made more clear, and in doing so solve the conflict with downloading Drupal.

I personally would like to see the modules page pushed further. New users don't know what they need, and therefor will not know which sub-category to look for. I like the view, and maybe wouldn't loose it, but a module by rating would be my top choice - "what's everyone else using?" Or perhaps module by task/activity with rating - "what do i need to build an ecommerce application?

Feedback on a number of items

jwhatcott-gdo's picture

The home page is too busy. Way to many choices and links in sections that have overlapping purposes. It is overwhelming.

I think it would be more effective to focus on specific top level actions that address the desires of likely site visitors. Joomla.org does a good job of this. I would like to see the home page have large, action-oriented blocks at the top above fold:

1) Get started with Drupal
2) Get help with Drupal
3) Get involved with the Drupal project
4) Find a Drupal job

The blocks that are currently in these areas have muddled messages. Combining "Get Started" and "Get Support" seems like a force fit. "Get the Full Drupal" is very unclear. "Develop with Drupal" is a mishmash of disparate items.

With the approach suggested above, we could have secondary pages that gather together the right resources for each choice. "Get Help with Drupal" would be a good place to gather a developer directory, documentation, commercial support options, etc. and other things (see Dries post above regarding the "professional services" issue). "Get involved with Drupal" would be a good place to spell out specific ways that people can contribute. This is sorely needed.

I agree with Jeff. There is

dries's picture

I agree with Jeff. There is too much too read on these home page blocks; these blocks could be more crisp and too the point. The messaging could be made simpler and more action oriented. Less is more. See http://wavemaker.com for an example.

Simpler is better, no doubt.

Nick Lewis's picture

Simpler is better, no doubt. I don't know if the focus needs to be on actions, per se... For all practical purposes, the first goal is get someone to download drupal, or to consider it as worthy of their powerful empire of hardware stores in the greater Cleveland Area.

The danger of the make-the-user-do-the-action strategery is that it requires the website to be bossy, generalize and gloss over the answers that the yet to be converted are asking themselves.

Don't get me wrong, it works REALLY well sometimes. However, I think its typically a strategy best served with websites with simple goals, simple products, and simple values. I think our epicenter problem is explaining to a fresh mind, why drupal kicks ass, documentation to support how much ass it kicks, and basic drupal concepts in plain english. From my non-scientific observations of clients and potential clients who want a website, and have money, there are several roadblocks drupal ALWAYS runs into:
1. WTF is "droople?" (they hate funny sounding things...)
2. Its free? Free like free baby vomit? I don't need no handouts! Free stuff is crap. I'm calling compubiztech.biz solutions and getting my website done in the latest high tech microsoft ASP.NET application platform with XML, Flash, Ajax, PHP, Mysql, Dreamweaver, Photoshop abilities. Microsoft is for serious businesses like mine.
3. My plain HTML site works just fine, how come this hiflautin CMS needs its own special PHP version, and for me to switch hosts, just so it works normal, like the current site. No one in this company does "web stuff", how is drupal gonna save me money? I got Eddie the webmaster, and he charges 50 an hour to upload new HTML files to our site via dreamweaver, and he's great -- looks great it IE6. etc.

That's a bit of an exaggeration (not by much). But its fairly representative of the mindset of someone who's too busy worrying about other things to check up on the latest trends in web development and open source content management systems. There's a huge communication gap that I think we should aim to fill before we start getting bossy about what people should do. We fail if we don't preemptively answer the questions popping up in their head. That's my concern, we're asking for action on their part, without giving them a reason to trust us.

So yes: clear calls to action, but I really think the focus needs to be gaining people's trust, and communcating a concrete statement about why "the droople" (that's how people in Texas seem to pronounce it) is what the hardware store owner, the struggling musician, and the startup CTO need, and want.

Maybe we think the same thing, I kinda feel like I'm smothering a statement with a large blanket of a ramble. Still, the action buttons are a kinda cliche.


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Agree there is too much content

Mark Boulton's picture

Thanks for your comment, Jeff.

During the research and interviewing we've conducted, we've found that some of the content you're talking about has been invaluable for evaluators of Drupal. Getting Started is a key call to action, as is getting help. One thing that is very important however is case studies -- people want to see what Drupal is used for, and by who.

Whilst there may be overlap in terms of sections, there shouldn't be overlap in terms of task -- which is what those blocks are trying to do. They're not exposing the section, or underlying IA, but trying to answer task related problems to specific audience groups - either insider, or outsider.

So, our task for this next round is to:

  1. Clarify the top three tasks for users of this page
  2. Simplify and clarify the content to support those tasks

We're also thinking about some fundamental changes to the navigation, but there will be more to come from Leisa on that topic shortly.

Modifications to the "Get started" section of homepage

batsonjay's picture

Several comments:

1) I like the four section layout below the lead text / image. But I think the content of the "Get Started, Get Support" doesn't actually deliver on the "Get support" component. I think a good example of how to handle this section might be to look (again?) at plone, which has a similar 4-element structure. Under their "Learn Plone" section, they put links to Documentation, Books, Forums/Chat rooms, Plone Training, and Commercial Support.

So, the "Get Support" part of this section delivers on its promise if you expand it to have the following links:
- Download Drupal
- Download an installation profile (but, see below)
- Documentation, books & training
- Forums & chat rooms
- Commercial support

2) Note that here I re-used the Plone community's solution for what to call "Professional Service" (by calling it "Commercial support"). This seems to be an effective description, since it easily embraces people providing site design / development, paid hosting, Acquia-style subscription support, and other commercially-related activities discussed in other posts above. IMHO, Commercial Support is the right word to use here.

("Commercial services" is an alternative; but when people are looking to write a check to get something done, they aren't usually looking for services per-se; they're looking for help, and in the tech business, "help" = "support". So Commercial Support will speak more to what people who want to pay are looking for.)

3) Note on installation profiles: I will admit my personal experience may not be representative. But many of the installation profiles I've actually tried are far from ready for prime time. If my experience is representative, I'd not (yet) include a link to installation profiles at this early in the life of installation profiles. If I'm correct in my assessment, we're sending new Drupal users into an area that is as likely to turn them off to Drupal as turn them on.... So I'd simply omit this link for now - and add it when the installation profile part of the Drupal world has matured a bit more. (Profiles do need a section to be better collected on drupal.org; but I'm just not sure it's ready enough to be the link that lives immediately below Download Drupal.)

4) Even if I'm wrong about installation profiles, there is strong evidence that new users care about themes before they even think about functionality. One of the things we at Acquia get from being in the business we're in is that we're trying to do business with a high volume of Drupal sites. Every day, we're having in-depth conversations with dozens of companies / people who have built and deployed a Drupal site. (As compared to professional services people who may talk deeply to 12-15 in a year.)

Virtually across the board we hear that the first thing people try to do with their Drupal site (after downloading Drupal) is make it look like they want it. Not just in block / module layout sense (the problem installation profiles try to solve); but in the graphical sense - what colors, what background graphics, etc. It's the first way people begin to personalize their site. Then they start to think about what functionality they want.

(In fact, our (unorganized) data suggests the availability of more off-the-shelf themes ("templates") for Joomla is the primary driving factor why people who are selecting their first CMS select Joomla over Drupal.)

So frankly, my list of links in the Get Started... section would be oriented towards the sequence people think when they're building a site:
- Download Drupal
- Find a page layout theme
- Documentation, books, & traiing
- Forums & chat rooms
- Commercial support

This makes intuitive sense: a) I download Drupal; b) I make it look pretty; c) I have my first questions, and need pointers to docs; d) There's too much docs to read - where are the Forums? e) Argh - this is too big to handle myself; where can I pay for help?

Cheers
-jb

...more off-the-shelf

WorldFallz's picture

...more off-the-shelf themes ("templates") for Joomla is the primary driving factor why people who are selecting their first CMS select Joomla over Drupal.

I absolutely agree-- and it's the reason I originally went with joomla first (about a year and half ago, after doing a lot of research with CMSMatrix and OpenSource CMS). The very first thing I did after downloading joomla was join rocketheme. I struggled with joomla for some time before turning to drupal. It was only after banging my head against the wall and sticking forks in my eyes for weeks trying to get joomla to do what i wanted it to do, that I finally considered giving up my beautiful theme to try drupal (and thank god i did!!!).

The only thing I see missing from your list is video training-- there is a huge wealth of amazing videos available for drupal that far and away reduce the pain of the learning curve more than anything else. People unwilling to read documentation for hours are usually more than willing to watch a video-- even multiple times.

We should also make recording and contributing videos (perhaps in the Contribute area) as easy as possible with links to software, bumpers, recommended settings, and step-by-step instructions. It's an excellent way for non-coders to contribute something back if we make it easy enough for folks to do in a spare 1/2 hour or so. There's some great info on this over in the drupaldojo group, but it really needs to be promoted to the main contribution area.

My only concern with naming

gdemet's picture

My only concern with naming the professional services section "Commercial Support" is that it might lead some to think that the companies listed primarily provide technical support services for Drupal installations, as opposed to "help planning, developing, using, maintaining, and/or supporting a Drupal site", which I think is closer to the kinds of services that most folks are looking for.

yes, case studies are important

jwhatcott-gdo's picture

I agree that case studies are important. I didn't mean to imply that they should disappear from the design altogether.

IMHO case studies should absolutely be one component of the home page. Having a rotating gallery for case studies would be a great part of the design. A nice block that has a navigable gallery of case studies would be great. Each case study would have a screenshot, a headline like "MTV UK rocks a zillion page views with Drupal 6", and a links to "details on MTV UK" and "see recent case studies" would be great. The user could navigate forward and backward to browse case studies without having to leave the page. You get the idea.

But the case study section should be subordinate to the action sections (e.g. "Get ...").

showcase

Chris Charlton's picture

I had a fruitless conversation with an old co-worker who chooses something not Drupal purely because of templates/themes they can edit and toss to a client with very little work done, and they expressed their reason for not adopting Drupal yet was due to the "ugly" sites they see. As also being a Flex fan I am able to point people to flex.org/showcase and the impressive designs/apps are pretty easy to sort by, and there being hundreds of sites listed using Flex it shows the technology is being used. I would love to see drupal.org/showcase because everyone can have a central, easy link that people can pass around in conversation.

Chris Charlton, Author & Drupal Community Leader, Enterprise Level Consultant

I teach you how to build Drupal Themes http://tinyurl.com/theme-drupal and provide add-on software at http://xtnd.us

Overall, I'm totally psyched

Nick Lewis's picture

Overall, I'm psyched at the direction this is going.
The front page is a sales page imho, other pages better serve as a portal to the vast world of drupal. Its the first page I send clients to when I'm trying to get them on the drupal boat. I'd like for me not to have to give them links to all sorts of pieces of proof -- scattered all over the place -- to convince them.

I think Jeff Whatcott touches on the biggest problem areas that I see.

The vertical layers feel a bit all over the place. I sort see 2 clear layers that could work at this point:
top: What is drupal? Download drupal, main points of interest (or perhaps a top headline or two of drupal news?)
second: pretty pictures, and various pieces of proof on how bad ass drupal is.
third: profit?

Attached is a big annotated screenshot, with specific notes. (fireshot kicks ass)

Take it with a grain of salt, I really love it a lot more than the comments seem to indicate -- and its all subjective, obviously.

Here's the screenshot and notes:
http://groups.drupal.org/files/armchairdesignerdigest.png


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Great comments

Mark Boulton's picture

Thanks for the great comments, Nick.

I think, and I agree with Jeff and Dries, that there is too much unconnected content on this revision of the homepage. We need clarity of purpose supporting key tasks for users on the Drupal learning curve (from Outsiders to Insiders and everything in between).

We're hoping to do that with the next revision.

you said it need love...

Nick Lewis's picture

Notes, and ideas for the poor "about" page in screenshot.

Only local images are allowed.

"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Advertising

dries's picture

What seems to be missing from the designs are ads. Ads have certain sizes/dimensions so it would be useful to design with ads in mind and to carve out room for ads on some of the mockups. The better ads integrate, the better our website will look, the more effective ads can be.

Ads are important for at least four reasons:

  • The Drupal Association is dependent on advertising revenue from drupal.org. Some of our revenue comes from book royalties, some of our revenue comes from membership contributions, some of our revenue comes from ads on drupal.org. If we want to contract Mark for future design work and refinements, we better make sure we continue to make money from ads. ;-) It is a great way to make money because it requires limited amount of work -- this is important in volunteer driven organizations. Plus, all the revenue is invested back into the project to help with drupal.org, events, etc.

  • Being able to advertise to Drupal users is important to build successful businesses. For example, if you are providing commercial Drupal training, you better be able to reach out to Drupal users or you'll fail. We want Drupal businesses to succeed because they help grow the project.

  • If you don't provide mechanisms for companies to reach out to Drupal users, these companies will start to exploit alternative channels such as the Drupal Planet, the forums, etc. It is good to be able to say: "don't spam the forums, buy an ad instead".

  • Ads in the right places are actually a service. For example, if you are looking for commercial Drupal training you would probably go to the 'Events' section of Drupal.org. If there was an ad for commercial Drupal training on the Events page, it would actually be what you were looking for.

That said, it would be good to design with ad dimensions/sizes in mind. Needless to say, we have to strike the right balance with ads.

At the same time, we should:

  • Look for opportunities for people and companies to get recognition for their contributions.

  • We should consider novel ways for people to advertise on drupal.org. For example, maybe we need to have a 'Services Drupal planet' and a 'Technical Drupal planet'? On the 'Services Drupal planet' people could submit product announcements, commercial case studies, etc without having to feel "bad" about it. We should encourage people to advertise their Drupal stuff -- how else would people learn about it?

Maybe a good first pass is

Nick Lewis's picture

Maybe a good first pass is finding 1 or 2 sterling spots on every page to put a message... Not unlike how the current homepage has that standard squarish box on the top left, that contains drupalcon, or planet banner. The box could contain a food dehydrator, or car wax for all the page layout and context cares, it doesn't matter -- its sectioned off space ready to use for whatever need we aren't foreseeing right now. I think its fine to not know what we'll put in the space, so long as we know the design can gracefully allow it as long as we follow a few hardcoded rules (tbd). If you build it, you'll eventually find a use for it -- at least that's what the voices in my head keep telling me.


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Very, very good point

Mark Boulton's picture

Thanks Dries. This is a very, very good point. Channels for revenue generation are important, as is the opportunity for visibility for community members and businesses (as you say).

We will be looking at integrating ad spaces into the next iteration. We'll be proposing a number of options, from text links to buttons and banners. We'll be using standard sizes for these as well (just so I go on record!)

Almost but having layout/graphic/font issues...

dahacouk's picture

Overall it's looking cleaner but...

Fluid Width:

  • Please don't restrict the width of the page. Keep the design fluid. In short, don't tell me what size browser I should have. I own a 30" desktop and a 8.9" laptop. Please design for both.

Scalable Fonts:

  • I use large font sizes. Your website is starting to degrade at 18 points. Make sure the website still works when the browser's minimum font size is 20 points and does not break the layout.

Sensibly Sized Images:

  • Really not sure way such a large MTV image is taking up so much valuable space on the homepage. What's that about? Should be quick overviews and intros and then news. Introductions is a good addition to homepage though.

Nice Logo Font:

  • Drupal logo font is uncomfortable. The use of non-parallel curved lines on the 'r', 'p' and 'a' doesn't feel nice.

One Drupal Logo:

  • I sincerely hope that you don't use that 5 drop splash. It could be a flower. It feels like an accident. A spill. Please stick to the current single drop logo and don't confuse. PEOPLE, DON'T CHANGE THE LOGO!

All in all going in a good direction. Keep up the good work.

Cheers Daniel

Width?

Mark Boulton's picture

Thanks for your comments.

I'd be interesting in going for an elastic layout, rather than purely fluid, wouldn't you think? Purely fluid sites destroy type legibility by increasing the measure too much.

Couple of things to clear up:

  1. Please note that this prototype currently uses Blueprint as its base CSS framework. This is not a PRODUCTION ready environment by any means.

  2. Also, please read Larry's post on 'Why we need the fish', but also, why we need a new logotype. http://www.garfieldtech.com/blog/drupal-org-logo-trademark That should provide some context for this work if you haven't read it already.

Thanks,
Mark

Yes! My width! My Font!...

dahacouk's picture

Thanks for your response...

Correct me if I'm wrong but the problem (for me) with elastic design is that it is locking the font size to the content width size. Is this what you mean by "destroy type legibility by increasing the measure too much"? Please explain this and perhaps give examples of when things go wrong.

Assume that I don't ever want any dead "white" space on either side of the main content - it's a waste of screen real estate. Elastic design just creates problems if I want to resize my browser window because when I zoom in to the content (to match the window size after I've changed it) the font size changes even though I may not want it to. Or if I want to change the font size I also have to change the window size to match (because the content size changes even though I may not want it to). What elastic doesn't do is expand the content to fill the browser window automatically and no matter what size I set the font to be.

Surely "convenience for the viewer" should be our maxim here, yes? Elastic design is just a cuter way of saying "set your browser to 800x600 to best view this site". Those days are gone, aren't they?

I guess the real question is: is this art or information? If it's art then just give me a .pdf or .png full of text and I'll shut up. But if this is information why on earth are you telling me the context in which I have to view it? Font size and content width should not have a fixed relationship - they should be independent of each other. You're an HTML designer not a graphic designer for this job, aren't you? There is a difference, right?

Please tell me why font size and content width should be hard linked? I just don't get it. Sorry if I'm labouring the point but this subject is pretty core with me.

Look forward to being enlightened...

Cheers Daniel

No! Width and Type should be carefully crafted

Mark Boulton's picture

My preference would be elastic. From my perspective, font size and content should absolutely be linked: layout and type have always been linked. An example of where this goes wrong is the very site you're looking at. If I look d.o now, the lines lengths are too long which means legibility is degraded as I resize my browser window.

A good compromise, however, would be a fluid layout rather than liquid. (eg http://css-tricks.com/the-perfect-fluid-width-layout/) This would mean we could control the min and max width so as not to degrade the reading experience for the user.

The best of both worlds, no?

Freedom to choose!

dahacouk's picture

"A good compromise, however, would be a fluid layout rather than liquid". Sorry, I was unaware that there was a difference but in either case, as far as I can tell, this is what we have on d.o - and I like it.

I still don't understand why you need to "control the min and max width so as not to degrade the reading experience for the user". If the user is web savvy they will have a font size, font style and browser window width set to suit themselves. Most users coming to d.o are web savvy. Why do we need to force them to do something else? I guess it comes down to this: I know better than you what I like. So, give me a web site in a way that I can make it be what I like. I guess this is about freedom for me to view information in the way that works best for me - freedom to choose.

My 30" screen width is 2560 pixels. My browser window is currently about 1800 pixels wide. My minimum font size is set to 20. My eyes are about 80 cm from the screen. These are perfect settings for me in this environment.

I don't understand: "If I look d.o now, the lines lengths are too long which means legibility is degraded as I resize my browser window." Please clarify. Are you making your browser window smaller or larger? Why are you changing the size of your browser? Surely, if the lines are too long for you then you would resize the browser to suit, no? In fact wouldn't you just set the browser to the width that you prefer in the first place and then set the font size and style to the one you find comfortable and then go surfing from there?

I love the current d.o for the very reason that the content is from the left edge to the right edge - there's no wastage. That fits into my way of working. You see everybody does things differently and likes to read different line lengths with different font sizes and styles and different browser window widths - not to mention different screen sizes, resolutions and DPI. We need to cater for these different setups and ways of working and allow users to control their own experience - because they know best for them. I know best for me. You know best for you.

That said, other aspects of the redesign are going great!...

Cheers Daniel

Logo...

dahacouk's picture

With regards to the logo may I suggest doing away with the graphic splash and just have the word in a font style?

My comments on the font style still hold - it just feels uncomfortable with those non-parallel curves.

Cheers Daniel

In my experience, the full

deviantintegral's picture

In my experience, the full page zoom feature in FF3, IE7, and Opera makes fixed width sites look really good on large displays. FF and Opera remember the setting per-domain, so next time you're back at the site it will be the same relative size. The only modern browser I know of which doesn't support full page zooming is Safari, though I imagine Safari 4 will have it. So, fixed vs fluid width is becoming less of an issue.

--Andrew

Still an issue even with zooming...

dahacouk's picture

Thanks for the tip...

But zooming doesn't work for me. Please see Yes! My width! My Font!... for the full explanation. I want HTML designers to de-couple font size from content width - otherwise they are graphic designers - and that's a whole different art from HTML design.

Cheers Daniel

Mark Boulton's picture

Sorry Daniel, but that's not only misleading, but entirely inaccurate.

"I want HTML designers to de-couple font size from content width - otherwise they are graphic designers - and that's a whole different art from HTML design."

There should be a link between font size and layout: it's how typographic hierarchy is crafted, which in turn, plays a big part in user experience. Once you separate the two to a large degree, both the hierarchy, and therefore the user experience is degraded. Also, just to put the record straight: I class myself as a graphic designer, who primarily works on the web, therefore I can write HTML and CSS - they are as much a part of a designers toolkit as Photoshop and a pen and paper. They are just tools. :)

What you say makes sense,

mike stewart's picture

What you say makes sense, and I suspect you've also left a lot unsaid. But just be clear this isn't a magazine layout. "Typical" user experience is of utmost importance, but as web designers, we don't have control of the user medium such as with a magazine. The new design must be accessible to all devices & people. I could say more, but my point is better made by this document: http://www.w3.org/TR/WCAG20/

My point is don't assume that the design delivered is how it will (or should) be seen. Drupal is used to make world-class websites. The drupal.org site should set the standard on how to remain inclusive of all users.

--
mike stewart { twitter: @MediaDoneRight | IRC nick: mike stewart }

Who researches a CMS from

Nick Lewis's picture

Who researches a CMS from their cell phones? Is what you suggest ideal? Yes. However, I can think of bigger priorities.


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

We go live to our CMS researcher in the field...

dahacouk's picture

"Oh gee... I'm on the train to work... I forgot that I needed to decide on a CMS today... I know I'll look on my iPhone... Joy!" 12.1% of iPhone usage is Web browsing ;-)

The point is that the Drupal site should work on many devices. We have to be flexible all the way from 3.5" to 30" screens, 480 to 2560 pixels wide and 100 to 250 dots per inch - those are just the figures possible today. This isn't difficult. It just necessitates a bit of forethought and a willingness to be flexible. For instance, on the iPhone, much of the work of scaling websites to fit is done by the browser.

Cheers Daniel

We don't need to sacrifice

gdemet's picture

We don't need to sacrifice the main site design to accommodate mobile users, but I think the new Drupal.org should definitely have a mobile-specific stylesheet that's available for iPhone/Blackberry/Treo/Android users. Personally speaking, I'd love to be able to pull up a version of Drupal Planet that's optimized for my iPhone without having to use a separate feed application.

drupal.mobi would be a great domain to have for a mobile-optimized version of Drupal.org, but it looks like someone from China is squatting on it right now.

For the record...

dahacouk's picture

My main points are in my other post. But, just for the record, I need to clear up that I'm not a graphic designer basher. So, permit me to clarify: I'd like to change my terminology a wee bit...

What I meant to say was: I want web designers to de-couple font size from content width - otherwise they are print designers - and that's a whole different art from web design."

What I didn't mean was "Font size and layout has nothing to do with 'HTML' designers". I didn't say: I want web designers to de-couple from font size and content width. ;-) But, in the end, web designers can't control the size of the font that the browser uses. Or, perhaps I should say that, they shouldn't try to control the font size. By all means set a default but let the user override it. That's the beauty of the web - the users are in control - well, if the web designer lets them.

"From my perspective, font size and content should absolutely be linked: layout and type have always been linked." Typography is an ancient and venerable art. HTML was invented in 1989 and SGML in 1974. I didn't see HTML in action until the mid 90's - probably like most people. "Always" is a relative term. If you're talking about print media then I'll agree with you - there has been, is and always will be a fixed relationship between font size, content width and layout. But the web is a new technology. It's a new medium. The rules are not the same for print. That's how we can have this kind of conversation about the basics. There is much more choice. Choice for how much freedom the web designer gives the user. A web designer can lock everything down or let the user decide. I vote for letting the user decide.

"There should be a link between font size and layout: it's how typographic hierarchy is crafted, which in turn, plays a big part in user experience." But clearly the web is not print. And please explain this "user experience" because whenever I go to a site that attempts to lock down fonts and widths I just get frustrated trying to do somersaults so I can read it.

"Once you separate the two to a large degree, both the hierarchy, and therefore the user experience is degraded." How is "user experience is degraded"? Please clarify. This is the real crux.

"Also, just to put the record straight: I class myself as a graphic designer". I know, I checked your resume! ;-) Hello, I am a web user. If you're ever down Dartmoor/Totnes way let me buy you a cup of herbal tea and we'll have a laugh.

Cheers Daniel

Or, perhaps I should say

Nick Lewis's picture

Or, perhaps I should say that, they shouldn't try to control the font size. By all means set a default but let the user override it. That's the beauty of the web - the users are in control - well, if the web designer lets them.

You make it sound like its sheer laziness. My clients would slap me if I wasted their money ensuring the design perfectly conformed to this vision. Its usually the last thing on their mind. AS far as I can tell, I can decrease, and increase the font sizes, and there are no problems. I have a giant monitor too. Sometimes I raise text size here and there, but I think its humbug to expect sites to look perfect when I do so.

The web and print are not so different in my opinion. In the end, its about using type that best communicates the message. Raising text size is a "feature" of the web.

In fact, web designers have much MORE to learn from print designers than vise versa.


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.entermedianow.com
blog: http://www.nicklewis.org


"We are all worms. But I believe that I am a glow-worm." - Winston Churchill
work: http://www.chapterthree.com
blog: http://www.nicklewis.org

Just wanted to add that I

Noyz's picture

Just wanted to add that I think Mark is on the money with this one.

Issues and details...

dahacouk's picture

I'd find it really helpful if you discussed issues rather than sided with people. Mark has offered various alternatives and there are a number of issues being discussed. We're just at the beginning of these issues - as far as I can tell - I haven't checked the archives - let me know if they've already been discussed somewhere. We haven't got into detail yet either - the specifics.

For example, Mark offers: "A good compromise, however, would be a fluid layout rather than liquid. (eg http://css-tricks.com/the-perfect-fluid-width-layout/) This would mean we could control the min and max width so as not to degrade the reading experience for the user." I still don't understand the need for any restriction at either end but, regardless, what are "the min and max width" that Mark would choose? What would you choose? If they where small enough and big enough then perhaps I'd be fine with them. See? It's all in the details? So, please be as specific as your time will allow so we can get clarity on these issues.

Cheers Daniel

Internationalization

zsanmartin's picture

Any news for Internationalization? It is very important for non-English speaker communities

I know that it's not possible to translate everything in drupal.org, but there are some sections that are really a must, such as "about" and "documentation" pages.

José San Martin

Just a minor note that

benmirkhah's picture

Just a minor note that background-color: #FFF; needs to be explicitly defined for the pages otherwise on some systems that don't use white as default they'll see it different, other than that looks great.

Front page

eigentor's picture

I second Dries and Jeff on the front page. Was't some discussion going on to make it more like http://www.joomla.org/ with clear actiion buttons? This could help the bottom (well the khaki colored) section. You have done the clever trick with the "above the fold" view which could be even extended: A screen that has about anything from 650-900 px in height should show the "above fold" view
which should be simple. No harm done to provide more and maybe tanglier information below this. What could also help IMHO ist to make the website preview (MTV.co.uk) a bit smaller, cause it is very dominant with the present MTV site. While it is good and there can be no better marketing effect than just showing really big and famous sites using drupal, one could guess one was on MTV...

Life is a process

Life is a journey, not a destination

I probably wouldn't be

deviantintegral's picture

I probably wouldn't be researching CMS's from a cell phone, but I'd definitely be looking at module pages. Probably also likely to be participating in g.d.o discussions!

--Andrew