Contributor
Pooja Patel

GNOME HIG CSS Library


Mentors
Claudio Wunder, CHenriksen
Organization
GNOME Foundation
Technologies
javascript, html5, css3, ruby, Jekyll, TailwindCSS
Topics
graphics, user experience, Web design, Toolkit Development, Web Framework
The GNOME organization has numerous websites to accommodate all its operations. Every website albeit serving different purposes falls under the GNOME umbrella. Consistency and homogeneity in the design of all present and future GNOME websites are imperative. The goal of this project is to develop and publish a unified CSS framework/library/toolkit incorporating the revised Human Interface and Visual Identity Guidelines that would allow developers to update existing GNOME websites or create new ones with a congruent visual identity. Evaluation, mockups, code-complete implementation, testing, and documentation of the individual elements such as labels, links, and images as well as composite components such as headers, footers and pagination will be performed. The project ensures creating a consistent framework with an exhaustive three-step workflow: 1. Inventory/Evaluation Phase: Variations in individual elements and composite components from each website are recorded to ensure all alternates are captured. 2. Iterative Design Phase: Mockups are created for each evaluated component considering all the possible variations encountered during evaluation. The mockups will be subsequently iterated upon after review and deliberation with the Design Team and other project stakeholders. 3. Implementation and Testing Phase: The final approved mockup will be implemented in TailwindCSS. The element/component will be documented and tested. Once the implementation is approved and all tests pass the element/component will be incorporated into the framework.