Skip to content

Latest commit

 

History

History
80 lines (40 loc) · 2.88 KB

README.md

File metadata and controls

80 lines (40 loc) · 2.88 KB

Natron UI 4.0 Project

A improved, free and open-source design of Natron's UI, with a modern interface that is:

  • distractionless and hassle-free to use

  • easy to learn and understand

  • customizable and themable

Currently, the main focus of this design is the original Anima Design System for Natron. View the prototype components here.

Contribution Guide

This project is going to be a massive, time-consuming undertaking, and I will never be able to finish it alone. I ask for anyone who uses Natron, and supports free and open-source, to contribute to this open-source design.

Some guidelines on contributions:

  • Please only share .alva, SVG or Inkscape SVG files, not files in a proprietary format, like Adobe XD or Sketch

  • Please stick to open-source fonts, such as Inter, Open Sans or Helvetica

  • Everyone's work will be under the terms of the MIT license

  • Be respectful of each others' work

  • Anyone can contribute to this project

  • All contributions will be protected under a GPL v3/CC-BY-SA license (both are equivalent)

For an extensive guide to contribution, please visit the Contributor Covenant

Key Issues to Solve

  • The Material Design System must be scrapped and replaced by a new design system (with exceptions*)

  • Excessive padding must be reduced

  • UI elements must be made more compact

  • Sliders must be changed to logarithmic and start in the center, with support for fine adjustments

  • Tabs from the previous design must be given a redesign, to make them less distracting and obstrusive

* Material Design icons will be kept and will continue to be used as the primary icon set

Overview

  • Create a new design system inspired by the UI elements of Blender, Fusion, Adobe's Spectrum Design System and Nuke

    • Recreate all the design components of each software (e.g. buttons, sliders, tabs) using Inkscape

    • Gather references of variations of the design components

    • Create a new design component based on the references and the design components of Blender, Fusion and Nuke

    • Put the finished design system into the style guide

  • After finishing the design system, use the new design system for creating the UI mockup

    • Create a wireframe for the mockup that follows Natron's current UI

    • Fill in the wireframe with components from the design system

    • Adjust the position and location of each components as required

  • Check the design and ensure compatibility with Natron's existing UI

  • Conduct user testing with surveys on Typeform

Requirements

  • The new design must not break compatibility with Natron's existing UI or Nuke's UI

  • The new design must be themable and support both light and dark themes

  • Relative sizes of panels must be kept the same with Natron's original

  • UI elements must support rearranging and minimizing