Design system.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

00-philosophy.md 1.9 KiB

1234567891011121314151617181920212223242526272829303132333435363738
  1. # Philosophy
  2. ## Design
  3. - Tesseract components follow a strict and simple design philosophy.
  4. - The aesthetics of the elements are rigid--any element which users can
  5. interact with should be easily recognizable--they are determined by the
  6. usage of the chosen accent color.
  7. - The look and feel of the elements are designed to be less opinionated
  8. as possible.
  9. ## Engineering
  10. - Every component is a derivative of an existing HTML element,
  11. thus any Tesseract component can substitute for any HTML element
  12. with added capabilities like improved user experience and consistency.
  13. - In case of overloaded HTML elements such as `<input>`, Tesseract
  14. dissects the element into multiple components each having a single
  15. defined behavior.
  16. - Tesseract components gracefully degrade to their native counterparts,
  17. allowing user agents without client-side JavaScript to still use the
  18. components with minimal loss of functionality.
  19. - Tesseract components render Web-compliant HTML and CSS, thus
  20. making it resilient to future changes in the HTML/CSS specifications.
  21. - Tesseract components are designed to be used with popular JavaScript
  22. frameworks like React. Consumption of the components using the framework
  23. of choice should be seamless, even with the use of form-handling libraries.
  24. - Terminal-based browsers such as Lynx are used to test the components
  25. for accessibility and graceful degradation.
  26. ## Accessibility
  27. - Components are made to be accessible according to Web standards (WAI-ARIA).
  28. - Focus handling is managed sensibly to facilitate functional
  29. keyboard navigation.
  30. - In cases where there are improvements in user experience, some
  31. elements may have different markup and appearance. Tesseract
  32. ensures components are still usable on most assistive technologies given
  33. both versions of the user interface.
  34. - All components are named in order to depict the purpose, the nature of data
  35. being operated, and UX expectations.