new design: request for comments

Mike Kolesnik mkolesni at redhat.com
Sun Aug 19 09:27:04 UTC 2012


----- Original Message -----
> Adding the arch list (for those who do not keep track of infra and
> not
> registered to board list)
> 
> 
> 
> On 16/08/12 20:17, Garrett LeSage wrote:
> > Hello all,
> > 
> > Warning: This email is long, but important.
> > 
> > I've been working on a new website design for oVirt, and gave folks
> > a
> > preview during yesterday's weekly status IRC meeting.
> > 
> > The website mockup is at:
> > http://people.redhat.com/glesage/oVirt/website/mockup-1/
> > (This is simply a static PNG exported from Inkscape, wrapped in a
> > very
> > simple HTML page. Therefore, don't expect it to scale with your
> > browser,
> > have selectable text, etc.)
> > 
> > The mockup has many different sections and updates, and I will
> > explain
> > each change, as well as the thought process that went into each,
> > below.
> > 
> > There are two main things to remember about this design:
> > 1) It's a bunch of individual changes that work together.
> > 2) It's a work in progress.
> > 
> > Also, the mockup was designed with our target audience in mind:
> > administrators (setting up and running the software), enthusiasts
> > (who
> > may run instances at home), and programmers (tinkering with and
> > contributing back to the project), all with experience using Linux
> > or
> > some form of UNIX. It is also important to note that our audience
> > is
> > specifically _not_ casual desktop users (although they could
> > benefit
> > from someone setting up and maintaining oVirt for them).
> > 
> > I'm eager to hear feedback on any and all changes, and work with
> > you to
> > refine everything.
> > 
> > When you do provide feedback, and want to discuss more than one
> > point,
> > please limit each email to one aspect of the site at a time. If
> > you'd
> > like to talk about the logo and the site structure, for instance,
> > please
> > send one email specifically talking about the logo, and then
> > another
> > discussing the structure. This should make conversations easier for
> > everyone to follow and make it easier for me to track requested
> > updates.
> > Thanks!
> > 
> > 
> > == Detailed changes ==
> > 
> > = Logo =
> > 
> > The oVirt logo is actually quite similar. I altered the "o" glyph,
> > to
> > make it more aesthetically pleasing.
> > 
> > Comparison graphic between current and new (in simple greyscale, to
> > make
> > it easy to see the difference):
> > http://people.redhat.com/glesage/oVirt/logo/ovirt-logo-proposed.png
> > 
> > 
> > = Color =
> > 
> > oVirt.org, right now, uses a green color throughout the site. The
> > oVirt
> > administration UI also features green in its header. As a result,
> > I've
> > pulled in that green and used it as the primary accent color for
> > the new
> > site design.
> > 
> > (It also has the advantage that it is not blue, which is overused
> > for
> > iconography, on the Internet, and for software in general.)
> > 
> > 
> > = Style =
> > 
> > Based on the typeface of our logo and our highlight color, our new
> > style
> > reflects simplicity, openness, vibrancy, and elegance.
> > 
> > We can make this style work for both the WordPress and Wiki parts
> > of the
> > site.
> > 
> > 
> > = Site structure =
> > 
> > A revised site structure is hinted at in the front page mockup. You
> > can
> > see this reflected in the top navigation. I did some overall
> > categorization, strongly influenced by Dave Neary's pre-existing
> > work on
> > the topic.
> > 
> > You can see a proposed sitemap here:
> > http://people.redhat.com/glesage/oVirt/website/ovirt-sitemap.txt
> > 
> > This is a general grouping of types of content, not necessarily a
> > view
> > of the top-level page, or of sub-pages. In some cases, these items
> > would
> > be sub-level pages, in others, they would be part of the navigation
> > page.
> > 
> > The documentation page would highlight the best documentation
> > available,
> > regardless of format - e.g. wiki, blog posts, etc. - and also have
> > a
> > prominent link to the wiki. Other sub-pages may also link to the
> > wiki,
> > if there is pertinent information (such as live docs for
> > developers,
> > linked to from the develop section).
> > 
> > 
> > = Tagline =
> > 
> > This is a short, catchy phrase to indicate what the project is all
> > about. Since the target of oVirt is running on a server, most
> > likely in
> > a datacenter, and it's open source, I figured we should make this
> > prominent.
> > 
> > Usually taglines are simple and direct, and often have some sort of
> > play
> > on words. "Open your virtual datacenter" can be interpreted in a
> > few ways:
> > 1) You can use oVirt to start (open up) a datacenter with
> > virtualization
> > 2) Take your existing datacenter and virtualize it
> > 3) Use oVirt as an open source solution to manage your datacenter
> > 
> > 
> > = Supporting lead-in text =
> > 
> > It's important to start with some powerful explanatory text to
> > state the
> > overall goal of the project. Usually, this ranges from a phrase to
> > around a sentence or two.
> > 
> > I wanted to express the purpose of the oVirt software in a very
> > high-level view, as a hook to get people interested to read more.
> > 
> > 
> > = Call to action =
> > 
> > "Start using oVirt now »" is a call-to-action button. After the
> > simple
> > text explaining what oVirt is, it's important to provide an obvious
> > next
> > step.
> > 
> > After clicking the button, it would take the viewer to another page
> > where it provides a quick and simple way to start using oVirt.
> > Naturally, one would have to download oVirt to use it, so it should
> > be
> > super-easy to do on this page. The page should also start a simple
> > step-by-step guide on getting oVirt working on one's own system(s).
> > 
> > I'm thinking that this may be, perhaps, simply a link to the
> > "Download &
> > Use" section. Yes, it's in the navigation, but it does provide a
> > very
> > important and clear next step, which helps with a natural-feeling
> > progression for an interested viewer of oVirt.org.
> > 
> > (BTW: If the simple guide is too complex, then we need to work at
> > further simplifying the process of setting up oVirt. It's important
> > to
> > try to lower the barrier to entry. Part of this is making sure that
> > oVirt can run on one machine as well, and possibly booting from
> > live USB
> > media for first-time evaluation purposes.)
> > 
> > 
> > = Front-page sections =
> > 
> > Most of text on the mockup is, in some way, based on content from
> > the
> > current oVirt.org website — it's just edited a bit.
> > 
> > While most everyone appreciates a clean aesthetic, our primary
> > target
> > group *also* likes to get to the point and see the information
> > right up
> > front. The mockup of the front page that I'm presenting is based on
> > this
> > concept.
> > 
> > In addition to being an overview of the project and the software it
> > produces, it also makes it really easy to explore from the content
> > areas
> > to relevant other parts of the website. By bringing the top-level
> > navigation into the context of the overviews, we make it easier for
> > someone to jump to other sections, instead of having to scroll back
> > up
> > to rely on the navigation.
> > 
> > The order of the front-page sections is important too. A goal with
> > this
> > design was to:
> > 1) Introduce people to oVirt, with a simple explanation
> > 2) Let people know right upfront that it's an active project
> > (release
> > blurb)
> > 3) Detail some of the most important features
> > 4) Make it clear that it's a community project
> > 5) Provide timely news & a way to easily get more info
> > 6) Publish information on upcoming oVirt-related events (currently,
> > in the
> > mockup, there's filler text for the time being)

I think the home page is overcrowded with text.
It makes me feel like I am reading a blog or some sort of PDF .

Adding to this is the monotonicity of using only the green color..

I think if we take as example Fedora or Gnome sites, you can see they look more colorful and less intimidating (less text in-your-face and the text is down the page, where whoever is really interested in it can read it).

Of course we're not talking about a desktop shell site here, but I think more graphics would make it more pleasant to look at.

Also I would add some screenshots/screencasts (maybe even a section where more can be viewed) since it really helps visualize what the product is and what it does.

> > 
> > Items #5 & #6 should both have a way to subscribe so that someone
> > could
> > access this information without visiting oVirt.org. Twitter solves
> > the
> > news component for us; we have to make sure the calendar is able to
> > be
> > subscribed to as well.
> > 
> > 
> > -=-=-
> > 
> > Thanks for reading all of this! I'm looking forward to all
> > conversations, especially if it's constructive (regardless of a
> > positive, negative, or neutral slant).
> > 
> > Garrett
> > _______________________________________________
> > Infra mailing list
> > Infra at ovirt.org
> > http://lists.ovirt.org/mailman/listinfo/infra
> 
> _______________________________________________
> Arch mailing list
> Arch at ovirt.org
> http://lists.ovirt.org/mailman/listinfo/arch
> 



More information about the Infra mailing list