0HyperCube 3bf5023ef8 Add alignment overlays (#462)
* Add alignment overlays

* Made snapping / overlays not render extra times, made snapping distance larger

* Revert snap tolerance change until user testing can be done

* WIP conversion to messages

* Revert "WIP conversion to messages"

This reverts commit ddcc23865a.

* Overlay document always has (0,0) in top left

* Fix AA on overlay lines

* Merge branch 'master' into alignment-overlays

* Squashed commit of the following:

commit dbc19912ca
Author: asyncth <97792158+asyncth@users.noreply.github.com>
Date:   Sun Jan 16 12:57:03 2022 +0500

    Set the mouse cursor in the canvas based on the current tool and its state (#480)

    * Add FrontendMouseCursor and DisplayMouseCursor

    * Add update_cursor method to the Fsm trait and implement it for all tools

    * Rename DisplayMouseCursor to UpdateMouseCursor

    * Add 'To CSS Cursor Property' transform decorator and change the mouse cursor in the canvas based on the current tool and its state

    * Implement update_cursor for Navigate tool properly

    * Keep the cursor when dragging outside of the canvas

    * Change the mouse cursor to 'zoom-in' when LMB dragging on canvas with Navigate tool

    * Rename FrontendMouseCursor to MouseCursorIcon

    * Rename 'event' to 'e' and replace v-on with @

    * Change the definition of the MouseCursorIcon type in TS

    * Replace switch with dictionary look-up

    * Move the definition of MouseCursorIcon closer to where it's used

commit 9b36e6a909
Author: Keavon Chambers <keavon@keavon.com>
Date:   Sat Jan 15 17:24:58 2022 -0800

    Fix all remaining Vue/TS errors flagged in Volar

commit 2cc39cdb37
Author: Keavon Chambers <keavon@keavon.com>
Date:   Sat Jan 15 12:55:51 2022 -0800

    Tweak whitespace around `use` statements and other lint fixes

commit fa390c3875
Author: Keavon Chambers <keavon@keavon.com>
Date:   Sat Jan 15 06:35:06 2022 -0800

    Change canvas artboard background color to be 1 shade lighter

commit ea2d003484
Author: Keavon Chambers <keavon@keavon.com>
Date:   Fri Jan 14 20:54:38 2022 -0800

    Modify all message enum data to use named struct values, not tuples (#479)

    * Massively reorganize and clean up the whole Rust codebase

    * Modify all message enum data to use named struct values, not tuples

commit 9b6cbb5f50
Author: Keavon Chambers <keavon@keavon.com>
Date:   Fri Jan 14 14:58:08 2022 -0800

    Massively reorganize and clean up the whole Rust codebase (#478)

    * Massively reorganize and clean up the whole Rust codebase

    * Additional changes during code review

commit a535f5c1c1
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 16:17:40 2022 -0800

    Sort messages and message handlers

commit e70858884d
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 14:16:13 2022 -0800

    Standardize FrontendMessage message names

commit 0b4934b4f3
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 12:45:07 2022 -0800

    Rename document_file.rs to document_message_handler.rs

commit ec7bf4a771
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 12:19:14 2022 -0800

    Rename DocumentsMessage to PortfolioMessage

commit 0991312ba0
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 11:44:49 2022 -0800

    Rename document_message_handler.rs to portfolio_message_handler.rs

commit c76c92e500
Author: 0HyperCube <78500760+0HyperCube@users.noreply.github.com>
Date:   Wed Jan 12 19:05:55 2022 +0000

    Migrate to using MoveSelectedLayersTo (#469)

    * migrate to using MoveSelectedLayersTo

    * Fix dragging a selected layer with multiple selected layers

    * Fix CreatedLayer overriding selection

    * Fix MoveSelectedLayersTo behaviour

    * Squashed commit of the following:

    commit 095d577a49
    Author: Keavon Chambers <keavon@keavon.com>
    Date:   Mon Jan 10 18:06:12 2022 -0800

        Fix NumberInput clamping regression with undefined bounds

    commit 9f54a376c4
    Author: mfish33 <32677537+mfish33@users.noreply.github.com>
    Date:   Sun Jan 9 15:52:55 2022 -0800

        Fix bounds with artboards for zoom-to-fit and scrollbar scaling (#473)

        * - document load keeps postition
        - zoom to fit
        - scrollbars use artboard dimensions

        * - review comments
        - svg export uses all artboard bounds

        Co-authored-by: Keavon Chambers <keavon@keavon.com>

    commit 61432de480
    Author: 0HyperCube <78500760+0HyperCube@users.noreply.github.com>
    Date:   Sat Jan 8 21:06:15 2022 +0000

        Fix rotation input (#472)

    * Fix insert with no nesting at end of panel

    * Deselect other layers on paste

    * Resolve logging

commit 574028375b
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 06:14:32 2022 -0800

    Add `npm start` script alias for `npm run serve`

commit 75e8fc6614
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 05:17:56 2022 -0800

    Switch VS Code's Vue extension from Vetur to Volar

commit 389b445ef1
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 12 03:56:28 2022 -0800

    Remove Charcoal references from the code for now

commit 095d577a49
Author: Keavon Chambers <keavon@keavon.com>
Date:   Mon Jan 10 18:06:12 2022 -0800

    Fix NumberInput clamping regression with undefined bounds

commit 9f54a376c4
Author: mfish33 <32677537+mfish33@users.noreply.github.com>
Date:   Sun Jan 9 15:52:55 2022 -0800

    Fix bounds with artboards for zoom-to-fit and scrollbar scaling (#473)

    * - document load keeps postition
    - zoom to fit
    - scrollbars use artboard dimensions

    * - review comments
    - svg export uses all artboard bounds

    Co-authored-by: Keavon Chambers <keavon@keavon.com>

commit 61432de480
Author: 0HyperCube <78500760+0HyperCube@users.noreply.github.com>
Date:   Sat Jan 8 21:06:15 2022 +0000

    Fix rotation input (#472)

commit 3eeac79f5a
Author: 0HyperCube <78500760+0HyperCube@users.noreply.github.com>
Date:   Sat Jan 8 16:30:03 2022 +0000

    Enhance the Navigate Tool zoom behavior (#461)

    * Snap zoom

    * Navigate zoom from centre

    * Ctrl to snap zoom in navigate

    * Use ctrl for global snap rotate

    * Fix the rotation input on snap rotate

    * Update hint to use ctrl

    * Fix mouse centre on drag

    * Click to zoom in

    * Clean up centre zoom

    * Update user input hints; tweak some variable names for clarity and standardization

    Co-authored-by: Keavon Chambers <keavon@keavon.com>

commit a2c2f7fc9d
Author: 0HyperCube <78500760+0HyperCube@users.noreply.github.com>
Date:   Sat Jan 8 16:02:02 2022 +0000

    Add support for resizing workspace panels (#443)

    * Resize panels

    * Removing move_selection test pending #444 resolved

    * Bind event listners and cursor to the document

    * Fix flex grow on document being reset when drawing

    * Call onresize when the boundry is dragged

    * Add min panel size

    * Add explicit function return types

    * Dispatch resize event

    * Lock pointer instead of setting cursor on document

    Co-authored-by: otdavies <oliver@psyfer.io>
    Co-authored-by: Keavon Chambers <keavon@keavon.com>

commit 54e9121115
Author: mfish33 <32677537+mfish33@users.noreply.github.com>
Date:   Sat Jan 8 07:50:08 2022 -0800

    Implement artboards and document version enforcement (#466)

    * - graphite document artboard implementation
    - autosave document load hitch fix
    - Autosave will delete saved files when graphite document version changes

    * formating

    * - top left 0,0
    - fixed hitch on first document
    - vue calls first render

    * Revert

    * Merge branch 'master' into artboards

    * Small bug fixes and code review tweaks

    Co-authored-by: Oliver Davies <oliver@psyfer.io>
    Co-authored-by: Keavon Chambers <keavon@keavon.com>

commit 11f15bd6af
Author: Leonard Pauli <leonardpauli@me.com>
Date:   Sat Jan 8 14:25:24 2022 +0100

    Path Tool: Implement anchor point dragging (#451)

    * #82 path-tool: WIP selecting control point working

    * Fix bug where duplication with Ctrl+D doesn't properly duplicate (#423)

    * bug fix: duplication didn't properly duplicate

    * cargo fmt

    * changed the formatting slightly for readability

    * Small cleanups, changed color of handles upon selection

    * Fix changes from merge

    * Remove duplicate anchor points on top of one another

    * Fix possible issues with thumbnails not being updated from Graphene operations

    * path-tool: attempt to move control points on click

    * Add dragging for control points

    * Editing shape anchors functional. Handles next.

    * Comment cleanup & slight cleanup of closest_anchor(..)

    * Removing conflict with master

    * Tiny code tweaks

    Co-authored-by: Keavon Chambers <keavon@keavon.com>
    Co-authored-by: caleb <56044292+caleb-ad@users.noreply.github.com>
    Co-authored-by: otdavies <oliver@psyfer.io>
    Co-authored-by: Dennis <dennis@kobert.dev>

commit 05e8a98f46
Author: Keavon Chambers <keavon@keavon.com>
Date:   Fri Jan 7 23:13:33 2022 -0800

    Redesign the Layer Tree UI (#468)

commit 8e3d237228
Author: Oliver Davies <oliver@psyfer.io>
Date:   Fri Jan 7 15:53:12 2022 -0800

    Ungroup layers (#465)

    * WIP handling corner cases, like ungrouping subfolders

    * Resolved hanging

    * Fix recursive ungrouping

    * Functional, corner case free Ungroup. Small Undo issue & warnings

    * Update layertree upon undo

    * Also update  layerdata upon redo

    * Add some polish

    * Resolved TODOs

    * Oops didn't save all after rename, ha.

    Co-authored-by: Dennis <dennis@kobert.dev>

commit c1c7192948
Author: TrueDoctor <dennis@kobert.dev>
Date:   Fri Jan 7 04:15:08 2022 +0100

    Tidy up path handling in document_file (#464)

    * Tidy up path handling in document_file

    + Improve #455

    * Cargo Clippy lints

    * Rename to_vec to map_to_vec

    Co-authored-by: Oliver Davies <oliver@psyfer.io>

commit f4707f9b74
Author: mfish33 <32677537+mfish33@users.noreply.github.com>
Date:   Thu Jan 6 18:45:37 2022 -0800

    Better decimal rounding in the NumberInput widget (#457)

    * better decimal rounding in NumberInput

    * - created function to reuse
    - used math instead of string manipulation

    * updated comment to be correct

    * updated comment

    * updated comment

commit 0219f060b8
Author: Keavon Chambers <keavon@keavon.com>
Date:   Wed Jan 5 05:40:32 2022 -0800

    Fix build script to use correct branch name

* Fix indentation

* Overlays fade in

* Fix formatting

* Add consts for snap visible and opacity

* Tweak constants for improved UX, rejigger imports

* Fix AA bounding box

* Snap only visible layers

* Add some comments

Co-authored-by: otdavies <oliver@psyfer.io>
Co-authored-by: Keavon Chambers <keavon@keavon.com>
2022-01-20 20:35:40 +00:00
2022-01-20 20:35:40 +00:00
2022-01-12 16:17:40 -08:00
2021-08-26 11:01:56 +02:00
2020-07-12 13:58:50 -07:00
2021-12-06 16:51:58 -08:00
2021-11-02 20:08:39 -07:00

Graphite Logo

Powerful 2D vector and raster editing. Procedural and nondestructive.

Graphite is a digital content creation software package for 2D graphics, merging traditional tool-based interactive editing workflows with a powerful node-based approach to procedural, non-destructive editing and compositing. The application strives to be the most user-friendly and versatile tool for vector and raster illustration, graphic design, photo editing, procedural texturing, data-driven visualization, and technical art.

While the project is still in early development, implementation progress has been moving forward at a swift pace. The Graphite Alpha release is launching soon and focuses on vector art for SVG creation. The next major milestone will introduce a nondestructive backend for vector graphics with a powerful node graph system. Later releases will provide better vector rendering capabilities and then resolution-agnostic raster editing and compositing.

Play around with Graphite right now in your browser at editor.graphite.design. Windows, Mac, and Linux will additionally be supported with a native (not web-based) desktop client later in the development roadmap.

Contributing

We need Rust and web developers! See instructions here for getting started.

We are also in search of a new logo and brand style system. If you are an experienced designer, please get in touch for more details.

Discord

If the Graphite project strikes your fancy, join our Discord community to chat with the community and development team. You're invited to stop by just to lurk, ask questions, offer suggestions, or get involved in the project. We are seeking collaborators to help design and develop the software and this is where we communicate. Paste https://di----scord.gg/uMjBz----5N68W into your browser and delete the dashes. (To prevent spam bots, please don't share the link on any website without the dashes.)

Vision

Graphite is an open source, cross-platform digital content creation desktop and web application for 2D graphics editing, photo processing, vector art, digital painting, illustration, data visualization, compositing, and more. Inspired by the open source success of Blender in the 3D domain, it aims to bring 2D content creation to new heights with efficient workflows influenced by Photoshop/Gimp and Illustrator/Inkscape and backed by a powerful node-based, nondestructive approach proven by Houdini and Substance.

The user experience of Graphite is of central importance, offering a meticulously-designed UI catering towards an intuitive and efficient artistic process. Users may draw and edit in the traditional interactive (WYSIWYG) viewport with the Layer Tree panel or jump in or out of the node graph at any time to tweak previous work and construct powerful procedural image generators that seamlessly sync with the interactive viewport. A core principle of the application is its 100% nondestructive workflow that is resolution-agnostic, meaning that raster-style image editing can be infinitely zoomed and scaled to arbitrary resolutions at a later time because editing is done by recording brush strokes, vector shapes, and other manipulations parametrically.

One might use the painting tools on a small laptop display, zoom into specific areas to add detail to finish the artwork, then perhaps try changing the simulated brush style from a blunt pencil to a soft acrylic paintbrush after-the-fact, and finally export the complete drawing at ultra high resolution for printing on a large poster.

On the surface, Graphite is an artistic medium for drawing anything imaginable— under the hood, the node graph in Graphite powers procedural graphics and parametric rendering to produce unique artwork and automated data-driven visualizations. Graphite brings together artistic workflows and empowers your creativity in a free, open source package that feels familiar but lets you delve further.

This UI mockup illustrates a future concept for the raster-based workflow in a photo editing example.

Demo UI mockup

Roadmap

The Graphite team is focusing initial feature development on a simple vector graphics editor for the Alpha release.

Following this MVP release, the layer system will be extended into a fleshed-out node graph system, called Graphene, to offer innovative nondestructive vector editing capabilities in the next milestone release.

The following major releases will add a purpose-built render engine to support node-based raster editing, thereby providing a seamless combined raster and vector workflow.

The interim web-based frontend will be replaced by an identical native desktop client for Windows, Mac, and Linux plus the web. This new frontend will mark the release of Graphite 1.0 when complete.

Development is broken into monthly sprints culminating in a presentation at the Rust Gamedev Meetup and a post in the Rust Gamedev Newsletter. Check out the Task Board to see the current features being built and prioritized.

Technology stack

Rust is the language of choice for many compelling reasons. It is low-level and highly efficient which is important because the nondestructive, resolution-agnostic editing approach will already be challenging to render quickly for interactive, real-time editing. Furthermore, Rust makes multithreading easy to implement and its safety guarantees will eliminate the inclusion of many bugs and crashes in the software. It is also simple to compile Rust code natively to Windows, Mac, Linux, and web browsers via WebAssembly, with the possibility of deploying Graphite to mobile devices down the road as well.

Vue.js is the web frontend framework initially used for building Graphite's user interface. This means, for the moment, Graphite will only run in a browser using Rust code compiled to WebAssembly (via wasm-bindgen). This web-based GUI is intended to be rewritten in a native Rust GUI framework once that ecosystem matures or the project has engineering resources to write a tailor-made GUI framework for Graphite's needs. Development initially began by writing a custom GUI system throughout 2020, but slow progress led to the decision of shelving it in lieu of a temporary web-based GUI.

WebGPU (via the WGPU Rust library) will be used as the graphics API for GPU-accelerated rendering because it is modern, portable, and safe. It makes deployment on the web and native platforms easy while ensuring consistent cross-platform behavior. Shaders will be written in Rust GPU to keep the codebase in a consistent language. Early Graphite releases are relying on web browsers' built-in SVG rendering capabilities before work begins building Graphite's sophisticated render engine.

Languages
Rust 88.6%
Svelte 6.2%
TypeScript 2.6%
JavaScript 1.1%
SCSS 0.8%
Other 0.7%