Graphite
UX Design & Development App
Working on Graphite was one of the most challenging, yet also the most interesting and rewarding experiences of my career. The goal was to create a tool that empowers designers and developers by providing the flexibility and freedom to build web and mobile applications with ease, regardless of their complexity.
Graphite combines a user-centred design approach with powerful database connectivity, allowing live client data to be integrated through APIs even during the early stages of development. This significantly reduces development time and enables smoother, faster, and more reliable transitions from design to production.
Complete set of tools
- Graphite introduces a simplified approach to rapid prototyping while preserving the full capabilities of HTML and CSS. This balance between speed and flexibility sets it apart from traditional design tools. The application includes a comprehensive toolkit for working with databases and APIs, along with an intuitive interface for creating interactions, animations, and responsive user experiences.
Advanced CSS Box Model
- Based on extensive market research, I designed an enhanced visual representation of the CSS Box Model. It expands upon the implementations found in Chrome and Firefox DevTools by providing more intuitive controls and a complete view of CSS properties, making layout editing faster and more accessible.
CSS 3 Grid Layout
- Recognising the importance of the CSS Grid specification as the future of modern web layouts, I designed a sophisticated integration of CSS Grid into Graphite. This enables developers and designers to build complex, responsive layouts visually while maintaining full compatibility with standard CSS.
Responsiveness
- Modern digital experiences must adapt seamlessly to a wide range of devices and screen sizes. Graphite features a flexible workspace that allows designers to preview, scale, and optimise their designs across multiple viewports, making responsive design an integral part of the workflow.
Style Galleries
- Graphite includes a unified gallery for styles, fonts, images, videos, and other media assets, providing quick access to reusable design resources. This feature streamlines the design process, promotes consistency, and helps teams work more efficiently across projects.
Tools & Techniques
- -- Adobe Photoshop
- -- Adobe Illustrator
- -- Adobe XD
- -- Lucidchart (Userflows)
- -- HTML/CSS
- -- ReactJS
- -- Material Design
- -- JIRA/Git
