fedoraproject.org front page redesign mockup #1

So as part of the ongoing www.fedoraproject.org website redesign project, I’ve been working on mockups for a new www.fedoraproject.org front page. Here’s the rough sitemap I’ve drawn up for the work:

As you can see, a lot of thought has been put into the home page and articles features on it (sections 1-5). I haven’t had much opportunity to flesh out the Get Help and Join Fedora sections yet, although I know Diana Harrelson’s anthropological study of the Fedora community is chock-full of useful data and recommendations, especially for the Join Fedora section. If you have any ideas or suggestions for either Join Fedora or Get Help please let me know, since we’re still in the process of fleshing out those sections.
Now, before I type out those img tags for the mockups themselves, a few caveats:

  • These are very rough mockups. I’ve been working out the navigation scheme with Sijis – I’m not happy with it right now so he’s been helping me figure out a better way – so it will probably change. So yeah, we know it kind of sucks, we’re working on it. 🙂
  • The position of individual elements on the screens will probably change. The one item I do not want to move is the download button in the right sidebar, though. I want it to be approximately in that area, although it may move up to be inside of the banner. This is because especially around a release, many users visit the website in order to download Fedora so the download button needs to be prominent.
  • The main banner is meant to be a slideshow. I’ll show some examples of alternative slides for it below. The idea was that the first slide would introduce users to Fedora, and subsequent slides will show you particular new features or highlights of the latest Fedora release. We’ll also have a slide in there to promote our community.

Mockups

(You can click on any of the mockups for a larger version)

Front Page

Alternate slideshow banners

Features

This page is so very rough – and these features are by no means exhaustive or even the right ones, just filler for now.

The Content

Jef van Schendel put together a content review of the current fedoraproject.org website and identified areas for improvement and called out essential elements we need to keep in place on the site. It’s a great read. Let’s dive a bit into the articles mentioned in his review and in the mockups above:

Tutorials

Ian MacGregor put together an initial list of tutorials for the tutorial section of the website. What do you think of them? Would you change any of them, or add additional ones? Do you know of any tutorials that already exist for Fedora that would be useful that could be formatted for the site?
Here’s Ian’s list:

  • Build beautiful color palettes for your home and wardrobe (Agave)
  • Automatically upload your files to a backup drive every week (crontab)
  • Access your favorite apps with one click (custom desktop launchers)
  • Decorate your desktop with family photos (Gimp tutorial)
  • Get organized and build a personal database (Gnote)
  • Turn your friends into the Hulk! (Cheese)

Your Life on Fedora

This article category still needs fleshing out. I’d like to see 5 article topics for it. ‘Your Life on Fedora’ is meant to show real-life use cases of Fedora users in a variety of situations – maybe an interview of a student with a sidebar highlighting her favorite apps, for example. My hope is that someone new to Fedora would come away from this set of articles with a better understanding of how Fedora might fit into their life.

What Makes Fedora Different?

What makes Fedora different is another article cateogory that needs more fleshing out. It is targeted at both users of other distros and other operating systems to point out what makes Fedora different from what they use now and to set their expectations. Why would you pick Fedora over another Linux distro, for example? Folks should have an answer to that question after reading this section.

The Project

So all of the work for this project is being organized on the Website redesign wiki page on the Fedora wiki. The www.fpo mockups are on the following page:

There’s a lot of ways you can help, so let me run through them in case you are interested 🙂 :

  • Writing Articles – Do any of the tutorial ideas above appeal to you? Do you have even better tutorial ideas? Want to write a tutorial that will appear on fedoraproject.org?
  • Brainstorming Article Ideas – Do you have ideas for articles in the ‘Your Life on Fedora’ or ‘What Makes Fedora Different?’ categories? Do you have a story about Fedora you’d like to share? Would you be willing to interview a friend or family member who uses Fedora?
  • Mockup feedback – Do you see any crackrock in the mockups I’ve posted here? (Of course you do!) Call it out! Let me know where we’ve goofed in the mockups, and your suggestions will be warmly welcomed!
  • Ideas for Join Fedora and Get Help – Do you help field questions on Fedora on the users list, forum, or IRC help channel? Have some great ideas for how the ‘Get Help’ pages on fedoraproject.org could be organized? Have you helped on-board various new Fedora contributors and have some experience you’d like to share for the Join Fedora section?
  • Content for the Features Page – Does the crappiness of the filler content in the Features mockup above give you severe indigestion? Do you have a clear idea of how we should be broadcasting Fedora’s features and have the time and will to write it up?

Anyhow, our work on the website in preparation for Fedora 14 continues; I just wanted to check in with you all and show you the latest. Please feel free to continue the conversation in the comments area on this blog post, or on the websites list, or in the websites channel at #fedora-websites on irc.freenode.net. We need your help to make Fedora’s website great; thanks for all of the feedback and suggestions you’ve given so far – it’s what’s gotten us here!

23 Comments

  1. This looks sweet and IMHO would bring the Fedora webpage back to the 21. century (as it seems to be stuck in the 20th now)

  2. just say wow! fantastic

  3. Once more great job Máirín. Just a tip if no one remembered this before… ask infra-structure team to keep a detailed update on hits/pages and check what people visit most and promote more those fields (not ignoring the strategical fields such as contribution mongering).
    On a personal level, I love the work being done, either in eye-candy and also in information placemente.
    +1000

  4. Felix says:

    looks great!
    One question: What is the name of the font you use for the annotations (the handwriting one)?

    1. It's Rufscript by Hiran Venugopalan. I met Hiran at FOSS.in in 2007; he's a very talented artist 🙂 He is also an open source artist so of course Rufscript is GPLv3+font exception. ( http://hiran.in/blog/rufscript-font ) I had thought I featured it in my font blog posts but it looks like I haven't, so I might do it next time 🙂

  5. this looks awesome, thanks for your hard work!

  6. SillyBead says:

    Much better than the current website! Looks a bit like Ubuntu's homepage which is great! Good work!

    1. Actually I'm not sure I'd agree looking like Ubuntu's homepage is great but…. 🙂

      1. SillyBead says:

        I meant the layout and the presentation of the relevant information is similar and much more organized. Aesthetically, I think that your mockup is much much nicer. Fedora's site really needs this overhaul.

        1. Ahh okay, thanks for the clarification 🙂

  7. As a relative newcomer to Linux, I've been distro-hopping for a while now. However, since Fedora 13's release, I've been making a personal pact to stick with Fedora for a time since it impressed me so much this release. In doing so, I've been trying to get a little deeper into the community, although as I'm sure is the case with many mid-range computer users, computing doesn't get a lot of allotted time since it's more of a hobby than an ambition.
    With that in mind, I think it would be fantastic to see a tutorial series that addresses some of the more advanced aspects of Linux. I've tried to teach myself some, and I'm sure there are resources out there, but my knowledge of things like the terminal are pretty haphazard. I can see the series covering the terminal, better package management, compiling, virtualization, etc..
    I would also love to help out in writing something of the sort if it caught on and someone with more experience could offer some recommendations about where to find information. I would love to learn more as I chipped in a project like that.
    As an aside thought, I find that Fedora's policy of not dumbing down Linux is fantastic. It's exciting to think that a new Fedora website could offer advise on how to really use Linux instead of using workarounds, but in simple enough terms that someone like myself could help my friends and family understand.
    And, by the way, I think the website mockup looks absolutely fantastic!

    1. Hey we just launched the new website today, but I remember your suggestion to have more advanced tutorials. Would you be willing to help improve the new website with some more advanced tutorials? I was thinking maybe a tutorial showing how to start a virtual guest from scratch would be really interesting. What do you think?

  8. Jef says:

    Awewome, Mo.
    I guess I'll just leave my own mockup here too then:
    http://schendje.fedorapeople.org/temp/fedoraproje
    Obviously that's not the layout we're going for, and it's just a slightly adapted version of yours, lol. But it may contain something useful.
    I'll post some feedback tomorrow after GUADEC is over (sadface). Is there already a thread on the Websites mailing list that we can use? If there isn't one, I'll create one tomorrow. 🙂

    1. Hey Jef!
      I like the three column structure towards the bottom… and the icons as well. We definitely have a lot to work with 🙂 I want to post your mockup to the main wiki for this if you don't mind.
      I haven't started a thread on list yet so feel free!
      ~m

      1. Jef says:

        Of course, post them wherever you want! 🙂
        I'll create a thread tonight.
        (Just came back from GUADEC. It was awesome!)

  9. […] header mockups Posted in Uncategorized by mairin on July 29, 2010 I worked through these fedoraproject.org redesign header mockups today with Sijis’ feedback. I’m really liking the last one, #7. […]

  10. Awesome!

  11. I wanted to look up the F14 release schedule and went to the current http://www.fp.o site; and was lost as to where I'd find it.
    'Documentation?' Nope.
    'Get?' Nope.
    'Communication?' Nope.
    Well, then I figured the wiki might have it somewhere. Saw a search box there, typed 'Fedora 14 release schedule' and was presented a set of irrelevant links. Back to the wiki frontpage, saw the 'What's inside Fedora' section, which had a link to a release schedule doc, which again didn't have what I wanted. Clicked the next link, F14 features, which thankfully had a link to the F14 release schedule at the bottom of the page.
    My feedback:
    – A search that works
    – A search box on the homepage (which is seen in your mockups, great!)
    – Get info on the current release
    – Get info on the future release(s)
    – Get info on past releases
    – This includes all the postmortems, feedback, marketing links, features, release schedules, d/l info, etc.
    Thanks for the work! 🙂

  12. Great! When i was switching to Linux, i didn't know much about it and i looked at popular distros, and i chose Ubuntu, not becouse it's made for newbies, but becouse it had the coolest website 😀 Seriously, the first impression of the distro comes up with the first view of the website. I want to say GREAT JOB ! I like the first and the third design, especially the first. I hope you use that one !! Good luck with finishing the project!!

  13. […] mockup specs like this and this. It’s the same process I’m following in creating the Fedora website redesign mockups I’ve been blogging so much about […]

  14. Ahmed M. Araby says:

    Fedora has freemedia group
    can a link to it be in the main page
    This might be very useful for newbies

  15. […] has been working on a redesign of the web presence for the Fedora Project and has recently been posting mockups of her ideas for the main page. We are now looking for […]

  16. […] Posted in Fedora, Fedora Design Team, Websites by mairin on September 3, 2010 So it’s been a while, a month really, since I’ve given you an update on the Fedora website redesign. Well, in the […]

Leave a Reply to PockataCancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.