Mozilla.org Redesign Phase 1

Mozilla.org, the non-profit organization who own the popular Firefox browser, are in the middle of a website redesign and have asked the Mozilla community for feedback on the first round of designs.

Happy Cog is working with Mozilla Foundation staff and the Mozilla community to address the redesign of the site to accurately reflect the site’s current role as a gateway site for the Mozilla Project and various Mozilla properties, along with being repository of official content. This site is the umbrella for all things related to Mozilla, and will give visitors a sense of being in a familiar place through not only the content and voice, but also by complementing and/or amplifying elements of the designs of other Mozilla properties.

Original Mozilla.org website

Primary Goals:

  • Make the site reflect the personality of community
    • The community is global
    • The community believes that openness, innovation, and opportunity are key to ensure the Internet benefits everyone
  • Provide a design that’s less product focused and more information and engagement focused
    • Teach people that Mozilla is more than just Firefox; that Mozilla is the defender of the open web.
  • Move people into deeper levels of engagement. For example, move people from knowledge about a product like Firefox, to understanding why the values of open web are making better experiences online and in life.
  • Create a sense of unity, with diversity within a larger community
  • Produce templates that can reuse content across site without major changes
  • Make site usable on mobile and other devices

Key Design Attributes

In single adjectives:

  • Open
  • Important
  • Flexible
  • Conscious (not self-conscious, though)
  • Smart
  • Vibrant
  • Strong
  • Beautiful
  • Stunning
  • Alive
  • Modern
  • Helpful
  • Happy
  • Transparent

Concept 1

The content and purpose of the current Mozilla.org is cloudy. Is this site a portal for those who are looking for something else? What do we want users to take away from a visit to this site? Do folks understand this is an established organization with clear goals that effect internet users on a worldwide scale?

This design attempts to establish Mozilla at the center of all those ideas; global, trusted, and a progressive open community that wants each and every web user to understand their values and contribute in some way.

Mozilla.org website concept 1

Home | Sub page

Concept 2

The brand identity of Mozilla was built on the idea of “Revolution,” but what if the “Revolution” was over? What if Mozilla was now the ideal: the utopia of software creation? What if Mozilla was the victor in all-things-internet? Can constructivism reinvent itself as modern movement?

This concept attempts to evolve the constructivist aesthetic into a postmodern style that would make artists like Robert Rauschenberg proud. Mixing oil paint, stenciled images of the Dino head, numbers that act as interactive elements, and various visual ephemera result in an extension of the Mozilla brand look-and-feel that plays homage to the assemblage and collage work the some of the finest modern abstract painters.

Mozilla.org website concept 2

Home | Home (second state) | Sub-page

Concept 3

How can we make the learning experience of Mozilla as easy as clicking one button? Can this action also help to build upon the idea that all-things Mozilla are driven by the actions of the community?

This concept approaches the idea of a low-barrier entry as an interactive question that allows users new and seasoned to help shape content that matters. Visually, the look is a weathered take on the constructivism aesthetic.

Mozilla.org website concept 3

Home | Home (question answered) | Home (comment) | Sub-page | Sub-page (open comments)

Thoughts?

Do you follow Mozilla? Is Firefox one of your main browsers? What do you think to the new visuals designed by Happy Cog?

Other Mozilla related post

Gary Hartley

Gary Hartley is The Floating Frog. A seasoned freelance web designer with skills in UI/UX, CRO design, WordPress, branding, PSD-HTML conversions and more. Got a project you need to start or take to the next level? Please, get in touch!