Inkscape Wiki - User contributions [en]

File:Gallery mockup.png

2011-04-15T17:45:18Z

And471:

Andrews Big Dialog Re-Design

2011-04-15T16:24:30Z

And471:

Andrews Big Dialog Re-Design

2011-04-15T10:59:46Z

And471:

Andrews Big Dialog Re-Design

2011-04-15T10:59:30Z

And471:

File:Document Metadata - redesign.png

2011-04-15T10:53:25Z

And471:

File:Document Metadata-2.png

2011-04-15T10:52:23Z

And471:

File:Document Metadata.png

2011-04-15T10:51:22Z

And471:

Andrews Big Dialog Re-Design/Document Metadata

2011-04-15T10:50:25Z

And471: Created page with '== Issues == File:Document Metadata.png File:Document Metadata-2.png # Lack of padding around the contents and between widgets make everything feel a bit 'squashed' # Wh...'

== Issues ==
[[File:Document Metadata.png]]
[[File:Document Metadata-2.png]]

# Lack of padding around the contents and between widgets make everything feel a bit 'squashed'
# Why is this needed? AFAIK it is a bit of technical information a user needn't know
# This is a lot of space needed for just one thing

== Solutions ==
[[File:Document Metadata - redesign.png]]

# Add in padding
# Get rid of it!
# Move radio options into a combobox. Also move all metadata attributes and values into a treeview so that they take up less space and can be scrolled. This means all information can be fitted into one tab and we can get rid of the notebook.

Andrews Big Dialog Re-Design

2011-04-15T10:41:56Z

And471:

File:Embed or link - redesign.png

2011-04-13T07:15:24Z

And471: uploaded a new version of "File:Embed or link - redesign.png"

File:Embed or link - redesign.png

2011-04-13T07:12:17Z

And471:

File:Embed or link.png

2011-04-13T07:11:15Z

And471:

Andrews Big Dialog Re-Design/Embed or Link

2011-04-13T07:10:51Z

And471: Created page with '== Issues == File:Embed or link.png # Whilst I as a developer understand this, it is far too technical to be here # Lack of padding around the contents make everything feel ...'

== Issues ==
[[File:Embed or link.png]]

# Whilst I as a developer understand this, it is far too technical to be here
# Lack of padding around the contents make everything feel a bit 'squashed'
# What is up with all that space?
# Embed and link are repeated A LOT
# All this information is packed together, so a user has to read this and then relate it back to the options. Also I don't really feel like reading that big paragraph
# What does OK do?

== Solutions ==
[[File:Embed or link - redesign.png]]

# Change the title to something more understandable
# Add in padding
# Get rid of it!
# Only write them once
# Move the information below the relevant option, so information and option are easily linked together. Splitting it up also makes it look a lot less 'intimidating'
# Write what it does - Import

Export Bitmap Dialog Re-Design

2011-04-13T07:00:01Z

And471: moved Export Bitmap Dialog Re-Design to Andrews Big Dialog Re-Design/Export Bitmap

#REDIRECT [[Andrews Big Dialog Re-Design/Export Bitmap]]

Andrews Big Dialog Re-Design/Export Bitmap

2011-04-13T07:00:01Z

And471: moved Export Bitmap Dialog Re-Design to Andrews Big Dialog Re-Design/Export Bitmap

== Issues ==
[[File:Export-as-bitmap.png]]
[[File:Export-as-bitmap-2.png]]

(Incorporating [https://bugs.launchpad.net/inkscape/+bug/168976] and [https://bugs.launchpad.net/inkscape/+bug/168446])

# Lack of padding around the contents make everything feel a bit 'squashed'
# As mentioned in [https://bugs.launchpad.net/inkscape/+bug/168446], Bitmap (whilst according to Wikipedia is technically correct) can be confused with exporting as a BMP
# Why are these titles so big?
# These labels can be made a bit more polished by using capitals and subscripts
# Why can't the units of these measurements be changed? (I often find this annoying when exporting to print)
# AFAIK this field will never become 'enabled' so why include it?
# The contents of these buttons have been set in a depreciated way so if icons are disabled in buttons they still show up
# The label of this is not clear, there are two negatives
# I find this confusing. It appears as though when I switch from Page to Custom, nothing actually happens. It needs to be made clearer what each one does.
# The 'Save' button is confusing here, as it doesn't actually save

== Solutions ==
[[File:Export-as-raster-image.png]]
[[File:Export-as-raster-image-2.png]]

# Add in padding
# Change to 'Export as Raster Image'
# Make the labels normal sized and bold
# Make x -> X and make numbers subscript
# Move the unit selector to the bottom of the dialog, so it affects all values (and doesn't leave such a large piece of whitespace above the Size section)
# Remove this entry and position the entry above it so that a user can see it affects both measurements
# Just change the way in which the images are but into the buttons
# Remove the two negatives and change to "Only show selected objects"
# (Whilst it is not in this mockup) except when Custom is selected, all the area fields should be disabled (insensitive).
# Change to "Select" (which is what it actually does)

OCAL Dialog Re-Design

2011-04-13T06:56:14Z

And471: moved OCAL Dialog Re-Design to Andrews Big Dialog Re-Design/OCAL

#REDIRECT [[Andrews Big Dialog Re-Design/OCAL]]

Andrews Big Dialog Re-Design/OCAL

2011-04-13T06:56:14Z

And471: moved OCAL Dialog Re-Design to Andrews Big Dialog Re-Design/OCAL

== Changes ==
* UI Redesign (which includes)
- Altered the padding and packing of all widgets
- Added search entry with clear and search icons
- Added OCAL Logo overlay
- Put descriptions inline in list
- New preview widget that shows extra metadata
- New status widget to notify on errors/success etc.
- Dialog is now persistent (retains state)
- Better messages for the user
- Changed title/menuitem to 'Import Clip Art'

* Backend stuff (which includes)
- Use new GFile API instead of depreciated GNOMEVFS
- Use async methods so the UI isn't blocked
- Use smaller, thumbnail images in the preview widget (save on bandwidth and increase speed)
- Implement cancelling of operations
- Put downloaded resources into one directory, from which we can use later
- Big cleanup in terms of code

== Screenshots ==

[[File:Ocal-dialog-normal-actual.png|200px]]
[[File:Ocal-dialog-no-results-actual.png|200px]]
[[File:Ocal-dialog-searching-actual.png|200px]]
[[File:Ocal-dialog-loading-actual.png|200px]]
[[File:Ocal-dialog-full-actual.png|200px]]

== Mockups ==

[[File:Ocal-dialog-normal.png|90px]]
[[File:Ocal-dialog-no-results.png|90px]]
[[File:Ocal-dialog-searching.png|90px]]
[[File:Ocal-dialog-loading.png|90px]]
[[File:Ocal-dialog-full.png|90px]]

File:Toggle-button-group.png

2011-04-08T16:27:07Z

And471:

Fill and Stroke Dialog Re-Design

2011-04-08T10:07:02Z

And471:

= Fill and Stroke Dialog Re-Design =
My name is Andrew and I have been using Inkscape for quite a while and have always found it fantastic! One thing I have found though, is that while some parts of Inkscape are brilliantly designed, some legacy parts you use a new lick of paint and a polish :)

One such part is the part I use most, the Fill and Stroke Dialog. This was also picked up recently by this blog post http://www.bomahy.nl/hylke/blog/on-gnome-and-elegance/ (yes we can all tell which application screenshots 2 and 3 are from :P )

'''I don't mean to hurt anybody's feelings with this. If I am too harsh I apologise, all I am trying to do is improve Inkscape :)'''

== Issues ==
[[File:Issues-fillandstrokedialog.png|left]]

# "Fill and Stroke [...]" is repeated, as are the window controls (close, minimise etc.) We have two window-bars when one would do, and the duplication makes it not obvious that this dialog can actually dock.
# No padding between the tab labels and images makes it look 'cramped'
# Yuck! Using such borders is depreciated (http://library.gnome.org/devel/hig-book/nightly/controls-frames.html.en) and clutters the dialog when white space provides the same separation but without the visual clutter. I can count at least 3 borders that just aren't needed
# The behaviour of the tabs at the top and these tabs are conflicting. The tabs at the top provides a mechanism of looking at '''completely different''' things, and notebooks should be used for (http://library.gnome.org/devel/hig-book/nightly/controls-notebooks.html.en). However the tabs here are used for looking at the '''same thing''' in a different way.
# The items above have two much padding in between them between columns, so they look disassociated, and have too little between rows so it looks cramped
# Why is this small? This is very useful and so shouldn't it be easy to click on and use?
# These widgets could be both on one line, but instead there is waisted whitespace and as a results, gives a disjointed look
# Opacity is given a useful unit, however Blur misses this out completely. Also this unit should be given after the number, it is not as useful on the other side of the dialog

== My Solution(s) ==
<table>
<tr>
<td>[[File:Fill-stroke-1.png|thumb|x180px]]</td>
<td>[[File:Fill-stroke-2.png|thumb|x180px]]</td>
</tr>
</table>

# Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity

----

=== Previous Solutions ===
[[File:Solution-fillandstrokedialog.png|x180px|left]]

<small># Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Transform the Togglebuttons into ComboBoxes - this allows use to have labels so we can see what each thing does and shows that the actions are mutually exclusive. The addition of the labels to the left of each combobox makes clear that the actions will do to the object.
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity</small>

Fill and Stroke Dialog Re-Design

2011-04-08T10:04:14Z

And471:

= Fill and Stroke Dialog Re-Design =
My name is Andrew and I have been using Inkscape for quite a while and have always found it fantastic! One thing I have found though, is that while some parts of Inkscape are brilliantly designed, some legacy parts you use a new lick of paint and a polish :)

One such part is the part I use most, the Fill and Stroke Dialog. This was also picked up recently by this blog post http://www.bomahy.nl/hylke/blog/on-gnome-and-elegance/ (yes we can all tell which application screenshots 2 and 3 are from :P )

'''I don't mean to hurt anybody's feelings with this. If I am too harsh I apologise, all I am trying to do is improve Inkscape :)'''

== Issues ==
[[File:Issues-fillandstrokedialog.png|left]]

# "Fill and Stroke [...]" is repeated, as are the window controls (close, minimise etc.) We have two window-bars when one would do, and the duplication makes it not obvious that this dialog can actually dock.
# No padding between the tab labels and images makes it look 'cramped'
# Yuck! Using such borders is depreciated (http://library.gnome.org/devel/hig-book/nightly/controls-frames.html.en) and clutters the dialog when white space provides the same separation but without the visual clutter. I can count at least 3 borders that just aren't needed
# The behaviour of the tabs at the top and these tabs are conflicting. The tabs at the top provides a mechanism of looking at '''completely different''' things, and notebooks should be used for (http://library.gnome.org/devel/hig-book/nightly/controls-notebooks.html.en). However the tabs here are used for looking at the '''same thing''' in a different way.
# The items above have two much padding in between them between columns, so they look disassociated, and have too little between rows so it looks cramped
# Why is this small? This is very useful and so shouldn't it be easy to click on and use?
# These widgets could be both on one line, but instead there is waisted whitespace and as a results, gives a disjointed look
# Opacity is given a useful unit, however Blur misses this out completely. Also this unit should be given after the number, it is not as useful on the other side of the dialog

== My Solution(s) ==
<table>
<tr>
<td>[[File:Fill-stroke-1.png|thumb|x180px]]</td>
<td>[[File:Fill-stroke-2.png|thumb|x180px]]</td>
</tr>
</table>

# Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity

=== Previous Solutions ===
[[File:Solution-fillandstrokedialog.png|x180px|left]]

<small># Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Transform the Togglebuttons into ComboBoxes - this allows use to have labels so we can see what each thing does and shows that the actions are mutually exclusive. The addition of the labels to the left of each combobox makes clear that the actions will do to the object.
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity</small>

Fill and Stroke Dialog Re-Design

2011-04-08T10:02:08Z

And471: Added better idea

= Fill and Stroke Dialog Re-Design =
My name is Andrew and I have been using Inkscape for quite a while and have always found it fantastic! One thing I have found though, is that while some parts of Inkscape are brilliantly designed, some legacy parts you use a new lick of paint and a polish :)

One such part is the part I use most, the Fill and Stroke Dialog. This was also picked up recently by this blog post http://www.bomahy.nl/hylke/blog/on-gnome-and-elegance/ (yes we can all tell which application screenshots 2 and 3 are from :P )

=== I don't mean to hurt anybody's feelings with this. If I am too harsh I apologise, all I am trying to do is improve Inkscape :) ===

== Issues ==
[[File:Issues-fillandstrokedialog.png|left]]

# "Fill and Stroke [...]" is repeated, as are the window controls (close, minimise etc.) We have two window-bars when one would do, and the duplication makes it not obvious that this dialog can actually dock.
# No padding between the tab labels and images makes it look 'cramped'
# Yuck! Using such borders is depreciated (http://library.gnome.org/devel/hig-book/nightly/controls-frames.html.en) and clutters the dialog when white space provides the same separation but without the visual clutter. I can count at least 3 borders that just aren't needed
# The behaviour of the tabs at the top and these tabs are conflicting. The tabs at the top provides a mechanism of looking at '''completely different''' things, and notebooks should be used for (http://library.gnome.org/devel/hig-book/nightly/controls-notebooks.html.en). However the tabs here are used for looking at the '''same thing''' in a different way.
# The items above have two much padding in between them between columns, so they look disassociated, and have too little between rows so it looks cramped
# Why is this small? This is very useful and so shouldn't it be easy to click on and use?
# These widgets could be both on one line, but instead there is waisted whitespace and as a results, gives a disjointed look
# Opacity is given a useful unit, however Blur misses this out completely. Also this unit should be given after the number, it is not as useful on the other side of the dialog

== My Solution(s) ==
<table>
<tr>
<td>[[File:Fill-stroke-1.png|thumb|x180px]]</td>
<td>[[File:Fill-stroke-2.png|thumb|x180px]]</td>
</tr>
</table>

# Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity

=== Previous Solutions ===
[[File:Solution-fillandstrokedialog.png|x180px|left]]

<small># Get rid of the standard GTK Window Bar (with gtk_window_set_decorated[false]) and replace it with a custom one. This shows it is not a standard window and makes it more obvious that it can be docked, rather than just appearing like a normal window.
# Just add in padding :)
# Transform the Togglebuttons into ComboBoxes - this allows use to have labels so we can see what each thing does and shows that the actions are mutually exclusive. The addition of the labels to the left of each combobox makes clear that the actions will do to the object.
# Replace borders with padding. Done :)
# Replace Notebook tabs with ToggleButtons to clarify their behaviour and differentiate them from the tabs at the tops.
# Sort out padding.
# Make it big.
# Put it all on one line with proper padding
# Give both a unit and put them after the quantity</small>

File:Fill-stroke-1.png

2011-04-08T09:57:15Z

And471: uploaded a new version of "File:Fill-stroke-1.png"

File:Fill-stroke-2.png

2011-04-08T09:56:50Z

And471:

File:Fill-stroke-1.png

2011-04-08T09:55:31Z

And471:

File:Trace-bitmap-siox.png

2011-04-08T09:01:30Z

And471: uploaded a new version of "File:Trace-bitmap-siox.png"

File:Trace-bitmap-tracing.png

2011-04-08T08:59:13Z

And471: uploaded a new version of "File:Trace-bitmap-tracing.png"

File:Trace-bitmap-default2.png

2011-04-08T08:40:19Z

And471: uploaded a new version of "File:Trace-bitmap-default2.png"

File:Trace-bitmap-default.png

2011-04-08T08:38:17Z

And471: uploaded a new version of "File:Trace-bitmap-default.png"

Andrews Big Dialog Re-Design

2011-04-08T08:31:12Z

And471:

Trace Bitmap Dialog Re-Design

2011-04-08T08:30:15Z

And471: Created page with '== Issues == # == Solutions == x180px x180px x180px [[File:Trace-bitmap-s...'

== Issues ==

#

== Solutions ==
[[File:Trace-bitmap-default.png|x180px]]
[[File:Trace-bitmap-default2.png|x180px]]
[[File:Trace-bitmap-tracing.png|x180px]]
[[File:Trace-bitmap-siox.png|x180px]]

#

File:Trace-bitmap-siox.png

2011-04-08T08:29:00Z

And471:

File:Trace-bitmap-tracing.png

2011-04-08T08:28:44Z

And471:

File:Trace-bitmap-default2.png

2011-04-08T08:28:28Z

And471:

File:Trace-bitmap-default.png

2011-04-08T08:28:16Z

And471:

Andrews Big Dialog Re-Design

2011-04-08T08:25:14Z

And471:

Andrews Big Dialog Re-Design

2011-04-08T08:24:25Z

And471: Created page with '<table> <tr> <td>[[OCAL_Dialog_Re-Design]]</td> <td>[[File:Export-as-raster-image.png|thumb|x100px|[[Export_Bitmap_Dialog_Re-D...'

Andrews Big Dialog Re-Design/OCAL

2011-04-04T15:58:35Z

And471:

File:Ocal-dialog-normal-actual.png

2011-04-04T15:55:11Z

And471: uploaded a new version of "File:Ocal-dialog-normal-actual.png"

File:Ocal-dialog-normal-actual.png

2011-04-04T15:51:58Z

And471: uploaded a new version of "File:Ocal-dialog-normal-actual.png"

File:Ocal-dialog-no-results-actual.png

2011-04-04T15:50:00Z

And471:

File:Ocal-dialog-loading-actual.png

2011-04-04T15:48:58Z

And471:

File:Ocal-dialog-full-actual.png

2011-04-04T15:47:56Z

And471:

File:Ocal-dialog-searching-actual.png

2011-04-04T15:46:55Z

And471:

File:Ocal-dialog-normal-actual.png

2011-04-04T15:45:54Z

And471:

Andrews Big Dialog Re-Design/OCAL

2011-04-04T15:45:37Z

And471:

Andrews Big Dialog Re-Design/Export Bitmap

2011-04-01T16:25:58Z

And471: /* Issues */

Andrews Big Dialog Re-Design/Export Bitmap

2011-04-01T16:25:27Z

And471: /* Issues */

== Issues ==
[[Export-as-bitmap.png]]
[[Export-as-bitmap-2.png]]

(Incorporating [https://bugs.launchpad.net/inkscape/+bug/168976] and [https://bugs.launchpad.net/inkscape/+bug/168446])

# Lack of padding around the contents make everything feel a bit 'squashed'
# As mentioned in [https://bugs.launchpad.net/inkscape/+bug/168446], Bitmap (whilst according to Wikipedia is technically correct) can be confused with exporting as a BMP
# Why are these titles so big?
# These labels can be made a bit more polished by using capitals and subscripts
# Why can't the units of these measurements be changed? (I often find this annoying when exporting to print)
# AFAIK this field will never become 'enabled' so why include it?
# The contents of these buttons have been set in a depreciated way so if icons are disabled in buttons they still show up
# The label of this is not clear, there are two negatives
# I find this confusing. It appears as though when I switch from Page to Custom, nothing actually happens. It needs to be made clearer what each one does.
# The 'Save' button is confusing here, as it doesn't actually save

== Solutions ==
[[File:Export-as-raster-image.png]]
[[File:Export-as-raster-image-2.png]]

# Add in padding
# Change to 'Export as Raster Image'
# Make the labels normal sized and bold
# Make x -> X and make numbers subscript
# Move the unit selector to the bottom of the dialog, so it affects all values (and doesn't leave such a large piece of whitespace above the Size section)
# Remove this entry and position the entry above it so that a user can see it affects both measurements
# Just change the way in which the images are but into the buttons
# Remove the two negatives and change to "Only show selected objects"
# (Whilst it is not in this mockup) except when Custom is selected, all the area fields should be disabled (insensitive).
# Change to "Select" (which is what it actually does)

File:Export-as-bitmap-2.png

2011-04-01T16:25:04Z

And471:

File:Export-as-bitmap.png

2011-04-01T16:24:51Z

And471:

Andrews Big Dialog Re-Design/Export Bitmap

2011-04-01T16:23:52Z

And471:

== Issues ==
(Incorporating [https://bugs.launchpad.net/inkscape/+bug/168976] and [https://bugs.launchpad.net/inkscape/+bug/168446])

# Lack of padding around the contents make everything feel a bit 'squashed'
# As mentioned in [https://bugs.launchpad.net/inkscape/+bug/168446], Bitmap (whilst according to Wikipedia is technically correct) can be confused with exporting as a BMP
# Why are these titles so big?
# These labels can be made a bit more polished by using capitals and subscripts
# Why can't the units of these measurements be changed? (I often find this annoying when exporting to print)
# AFAIK this field will never become 'enabled' so why include it?
# The contents of these buttons have been set in a depreciated way so if icons are disabled in buttons they still show up
# The label of this is not clear, there are two negatives
# I find this confusing. It appears as though when I switch from Page to Custom, nothing actually happens. It needs to be made clearer what each one does.
# The 'Save' button is confusing here, as it doesn't actually save

== Solutions ==
[[File:Export-as-raster-image.png]]
[[File:Export-as-raster-image-2.png]]

# Add in padding
# Change to 'Export as Raster Image'
# Make the labels normal sized and bold
# Make x -> X and make numbers subscript
# Move the unit selector to the bottom of the dialog, so it affects all values (and doesn't leave such a large piece of whitespace above the Size section)
# Remove this entry and position the entry above it so that a user can see it affects both measurements
# Just change the way in which the images are but into the buttons
# Remove the two negatives and change to "Only show selected objects"
# (Whilst it is not in this mockup) except when Custom is selected, all the area fields should be disabled (insensitive).
# Change to "Select" (which is what it actually does)