![]() Select the Bezier Path tool (11th icon down in the Tool Area). Start with the background rectangle from the "brighter, more colorful iPhone icon" created above (if you created a cloned version for the round corners, don't copy the cloned version as it will behave strangely). The checkbox and checkmark will then need to be more distinctive as they will be the only significant graphical elements Creating a path This variation will forego the starburst effect and instead go for a smoother, more "cartoonish" approach. See a Path Effect (Spiro Spline) in action.Directly edit paths for greater control.Icon 3: A cartoonish style Goals in this section Now follow the instructions from the "Apply the gloss effect and round corners" subsection of the previous post to complete the icon. Select the Gaussian Blur row and set the Standard Deviation to 1.0. Select the Offset row and set the X,Y offset to (0.8,0.8). Go to the Filter Editor and find this Cutout Glow filter. With both checkbox and checkmark selected, choose Filters→Shadows and Glows→Cutout Glow. Select the checkmark and set the stroke color to RGBA=(255,42,42,255) and the stroke width to 4.0 "px". The result of these steps is to create a slightly thicker line that is curved on the corners within its width. In the Fill and Stroke Editor, select the Stroke Style Tab and set the Line Width to 4.0 "px" and the Join Style to rounded. Remove the corner radius from the checkbox (select it using the rectangle tool and set the Rx and Ry to zero). If you copy them in, select both the checkbox and the checkmark and choose Filters→Remove Filters to remove the shadow and bevel effect applied in the first part. Different stroke properties for the checkbox and checkmarkĬreate the checkbox and checkmark in the same way that they were created in the first part or copy them in. Select the Gaussian Blur effect and set the standard deviation to 0.75. Now, to make the starburst smoother, open the Filter Editor (from the Filters menu) and find the starburst's blur effect (it should be selected in the filter column when the starburst itself is selected). In the Fill and Stroke palette, set the opacity of the starburst to 100%. Over the top of this, paste (or recreate) the starburst effect from Part - X,Y=(-15.7,-15.7) should center it perfectly. We now have a bright spot in the center of the background. Top to bottom, the four gradient colors should be: In the Gradient Editor, click "Add Stop" twice to make the gradient a four part gradient. Set the fill to a radial fill and edit the gradient. Starting with a 57x57 document as created in Part 1, add a rectangle filling the document area. I'll also introduce a complimentary (opposite hues) color scheme with an azure blue and a red. In this variation, I'll have the background reach a bright point behind the checkbox element and change the effect on the lines so that the lines look embossed into this bright point - visually integrating the background and the overlayed element. The icon developed in Part 1 is very simple - really just a couple white lines over a typical iPhone icon background - which is appropriate for a serious application but might not stand out as prominently against other icons. Learn to adjust all of the common stroke properties.Icon 2: A brighter, more colorful iPhone icon Goals in this section I'll assume that you've read the first part or are familiar with the techniques involved. I'll go through the creation of the remaining variations on the checkbox/checkmark theme in this post. The first icon was created in the first part of the series. #INKSCAPE GRADIENT EDITOR SERIES#This series covers the creation of the following different icon styles: #INKSCAPE GRADIENT EDITOR MAC#I'll also present some Mac application icons and simple texturing. In this part, I expand on the simple techniques presented in the first part by adding different line, effect and texture styles. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |