Book Image

Inkscape by Example

By : István Szép
Book Image

Inkscape by Example

By: István Szép

Overview of this book

Growing into its final form after years of development, Inkscape now rivals industry leaders like Illustrator and CorelDraw – this versatile free vector graphics editor program has all the capabilities of paid software and is ready for professional use. While there are plenty of resources for beginners, this book will enable you to uncover the full potential of the tool through sample projects and tutorials. With Inkscape by Example, you’ll understand how this one-stop solution helps vector designers meet all their requirements. Starting with an introduction to the new tools and features of Inkscape 1.0, you’ll master the software by working through a chain of real-world projects. The book will guide you through creating an icon set and understanding modularity in vector design. As you advance, you’ll draw a detailed illustration every client is looking for and learn about photo editing and creating a logo in Inkscape, combining all of these into one single web design project. Finally, you’ll discover tips for working faster with SVG and XML and using Inkscape with other free tools to reach maximum workflow and creativity. By the end of this Inkscape book, you’ll have developed the skills to create your own solutions for any project confidently.
Table of Contents (12 chapters)

Saving and exporting your website design

After creating the two layout versions of a website, you usually want to use the design. This means you might present it to a client, export the components and hand it over to a developer, or prepare to build the live version yourself.

Exporting the designs as mockups for a presentation is pretty straightforward. Select the website design and export it as a .png image in standard 96 DPI resolution. This is usually sufficient to give a preview to anyone and show off the work you created.

Saving individual components

To use the designs for building the website, you need to decide what the components that you actually need to export are, and which can be expressed in code. You will need to export the logo, the hero illustration, the icons, and the contact icon in the footer.

Select these components one by one to export them as .svg files. Here is a short description of how to save parts of a website design as .svg files for online use...