projects:design_with_git
Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
projects:design_with_git [2014/11/28 14:53] – [Some examples of designers using Git] Julien Deswaef | projects:design_with_git [2016/11/04 03:04] (current) – [NYC] Julien Deswaef | ||
---|---|---|---|
Line 21: | Line 21: | ||
This project is about designing a multi-platform tool, build on top of Git and web technologies, | This project is about designing a multi-platform tool, build on top of Git and web technologies, | ||
- | |||
- | |||
- | ===== Medialab Prado ===== | ||
- | |||
- | This idea has been looping around in my head for a while and < | ||
- | |||
- | [[projects: | ||
- | |||
- | Draft for the [[projects: | ||
- | |||
- | [[projects: | ||
===== Some examples of designers using Git ===== | ===== Some examples of designers using Git ===== | ||
Line 38: | Line 27: | ||
* [[http:// | * [[http:// | ||
* [[https:// | * [[https:// | ||
- | * [[http:// | + | * [[http:// |
- | + | ||
- | ===== File formats ===== | + | |
- | Since version control systems work best with text, we are looking for file formats that are represented as such. Not that it's impossible to use a version control system with binary files, to my knowledge, you get all the benefits from using it by using mainly text files. For example, a version control system can tell you exactly the differences between two version of the same text file and point you exactly where those differences are but it can only tell you that a binary file has been changed but not how. | + | |
- | + | ||
- | So we are looking for design files that are represented in a textual format. As an obvious basic examble, any html/CSS files work. Obviously also, most vector graphic files are written in plain text. For raster images, textual file formats are quite rare. | + | |
- | + | ||
- | * SVG | + | |
- | * ODG (Open Document Drawing) | + | |
- | * DXF | + | |
- | * OBJ | + | |
- | * ASCII STL | + | |
- | * [[https:// | + | |
- | * SFD (Fontforge) | + | |
- | * GLIF (Glyph Interchange Format) | + | |
- | * UFO ([[http:// | + | |
- | * PS (Postscript) | + | |
- | * XPM ([[https:// | + | |
- | * ASCII PNM ([[https:// | + | |
- | * ORA ([[https:// | + | |
- | * SLA / SCD (Scribus) | + | |
- | + | ||
- | ===== The case for SVG, Inkscape and Git ===== | + | |
- | + | ||
- | SVG is a becoming a wildly used format. Most modern browsers can display it. The format has been around for quite a while and many (if not all) graphic softwares support it. It's also quite an easy human readable format. | + | |
- | + | ||
- | Inkscape is also becoming a well respected graphic tool in the open source design community. It can import and export multiple graphic file formats. The interface is quite easy to apprehend and it uses SVG as a base file format. Inkscape is also extendable and uses python as scripting language. Inkscape is a tool used by webdesigners, | + | |
- | + | ||
- | Git is the trending version control system of today. His popularity (with websites like Github or Gitorious) and distributed capabilites make it a tool of choice for every designer concerned with efficient production workflow and collaboration. | + | |
- | + | ||
- | As stated, SVG and Inkscape are already well interdependent. It seems obvious and almost trivial to integrate the features of git to this already excellent tool. | + | |
- | ==== Possible integrations of Git into Inkscape ==== | + | |
- | * Have the basic git commands integrated in the GUI (like init, add, commit, branch, push pull,...) | + | |
- | * Have the commit history displayed as a list or graph so the designer can go back in time and recall older versions. | + | |
- | * Have a special viewer that can display the differences between two commits in different ways. | + | |
- | + | ||
- | === Graphical Diff Suggestion === | + | |
- | + | ||
- | Very cool project! | + | |
- | + | ||
- | As a " | + | |
- | a way to use ImageMagick' | + | |
- | + | ||
- | First, a python script (//e.g// compare.py) to render the two SVGs to bitmaps | + | |
- | via Inkscape and then do the final diff via ImageMagick: | + | |
- | + | ||
- | <code python> | + | |
- | # | + | |
- | import sys, os | + | |
- | + | ||
- | inkscape = " | + | |
- | local = sys.argv[1] | + | ===== History of development ===== |
- | remote | + | |
- | tempdir | + | |
- | localpng | + | |
- | remotepng | + | |
- | if(not (remote.endswith(" | ||
- | os.system(" | ||
- | else: | ||
- | os.system(inkscape+" | ||
- | os.system(inkscape+" | ||
- | os.system(" | ||
- | os.remove(localpng) | ||
- | os.remove(remotepng) | ||
- | </ | ||
- | Then add a hook like this to your .gitconfig: | ||
- | < | ||
- | [difftool " | ||
- | cmd = "/ | ||
- | </ | ||
- | Then "git difftool -y -t compare" | + | ==== Medialab Prado ==== |
- | highlighting changed regions in red. | + | |
- | Hope this helps, | + | This idea has been has been submitted and selected for the **Tools for a read-write world** at [[http:// |
- | --Mark | + | * [[projects: |
+ | * Draft for the [[projects: | ||
+ | * [[projects: | ||
+ | * [[http:// | ||
- | Thx Mark. Will look into that. If you want to give a hand during the worshop, you're welcome. | ||
- | --- // | ||
- | === Possible screenshots | + | ===== Related pages ===== |
- | {{: | + | * [[projects:design_with_git: |
+ | * [[projects: | ||
+ | * [[projects: | ||
- | === Visual libs to try out === | ||
- | * http:// | ||
projects/design_with_git.1417182780.txt.gz · Last modified: 2014/11/28 14:53 by Julien Deswaef