Create custom start menu on Gnome desktop using Inkscape…
This is my 2nd experiment to create custom start menu on my desktop. The first you can visit the preview desktop in here, and the 2nd preview will discussed in this post. Inkscape vector ilustrator is more than just ilustrator tool, we can create creative object and another graphic design, ie desktop graphic,icons, panel, wallpaper and etc. Gnome is one of opensource desktop manager, there’s have beautiful desktop view, and we can make desktop as easily as you want. Now, i’m creating start menu button to replce default start menu on my ubuntu studio 8.10. This’s the screenshoot.

You can create another design and apply the start menu on your custom desktop . This is step by step how to create the custom start menu using inkscape vector Graphic Editor.
- launch the inkscape vector ilustrator, Application >> Graphics >> Inkscape.
- Set the default documents properties, i’m create the start menu dimension on 100×34 pixel. it’s up to you to determine this dimension. to set this document properties :File >> Document Properties. and set your documents dimension on the field. Close the window to complete your configuration.

- create rectangle using Tool Rectangles and square (f4), this is create for the background of the start button. you can set the dimension :92 x 34px.

- Next step we can make flection on right side, it’s like as windows xp button, to create the flection convert the rectangle to path, choose form menu bar: Path >> Object to Path or use the shoort cut (Ctrl + Shift + C )
- Chose the right line using path selector (F2). and the next task is make the strike line to flection line, press the F2 and click on right border line, then click on top menu bar “Make Selected Custom Curve” button, and fly your imagination in here..

- Next step, we can make shadow, it’s like a 3d button, select the object then we can duplicate it, we can use Ctrl + D to easy our work. Scale your duplicate result using select and transform object tool (F1) an then press on the 2nd object, drag and pres Shift button to have scalable result, it’s better if we give the different colour for the 2nd objet like this.

- Oh, it’s haven’t seen it, next we make blur effect for 2nd object, show theFill and Stroke properties side tab using Ctrl + Shift + F . Select the 2nd Object and chose from Fill and stroke Properties, you can see the blur slide, fill blur number on the field(ie i’m using 5.0). and this’s the result.

- Ok, it’s better then the past view:P, next step we make the glass effect, i’m usually use the previous object an then using Ctrl + D to duplicate it, Ok, select the 2nd obcject and duplicate this object, the result is 3rd object and it’s better when we change the fill color to more easy our work. this’s the result. ups..don’t forget to adjust the blur number and opacity number to get the best view on your mind like this.

- It’s not enough glass effect, we must add another effect on the flection side, we can duplicate the 3rd object an rotate(use button “[" or "]“) the object result(4th Object) and place the position like this. it’s more interested if we’re make the shadow like a flection.

- We can add the glass shine effect to make our start like a lamp. Chose (F1) the first object (background) and the duplicate it(Ctrl + D), we get 4th object, change the fill objet, i’m use white fill color to give glass effect. the 4th object will be positon in front of all, it’s ok, next step we must adjust the size and shape for get the glass as we need, like this.

- It’s need to be adjust the transparency, select (F1) the 4th object an then press the Create and Edits Gradient (Ctrl +F1),and then drag from top to bottom, it’s the result.

- It’s look like a button now, we can add more glass effect, we can repeat the step-8, but we must set the colour to soft fill, and we can place the 5th objet in behind of 4th object, and this’s the view.

- The last, we can add the text ,it’s better if we choose the right font type and the postion, in example we add the UGOS logo company profile, and the text menu is “Menu”, you can use “Start” or “Mulai” it’s up to you
. and This is the final start button. 
- Export the custom icon, Ctrl+ Shift + E, and give the custom name.png
Ok, The custom start menu was ready to use for our desktop, i’m using ubuntustudio 8.10 to apply this custom start menu button, an this is the step.
- Right click on bottom panel, and then >> add to panel >> choose the “main menu” an place the new start on position as you like, in example bottom left.
- Press Alt+F2 to Launch the gconf-editor
- Find the /apps/panel/object_0
- check on use_custom_iconcheckbox on”use_custom_icon”
- Browse the locate file custom icon
- finish












April 23rd, 2009 at 9:26 am
Good idea! Thank you
[Reply]