A New-to-me Option for Bead Illustration Software

Graphic - vector illustration and design by Indeeo, Inc.

Every few months I receive an email from someone asking what software I use to create my bead diagrams and illustrations.  To date, I've used Adobe Illustrator, but that may soon change as I continue to explore a new iOS ap called Graphic.

I love Adobe Illustrator. It's been the gold standard for vector-based graphic design and illustration for years, for good reasons.  But it also costs a pretty penny.  I'm lucky enough to own an old copy of Adobe Creative Suite 6 (CS6), purchased right before they moved to a subscription model.  These days, the single-app license for Illustrator is $19.99/month if you don't happen to be a student or teacher.  The price makes it really hard for me to recommend it to other indie designers.  I also worry about what I'll do when my current version of CS6 gets too old and glitchy to work with the latest operating systems on my computer.  Sooner or later, it's bound to happen.

This means I'm always on the look out for a solid, low-cost alternative.  Last night, I think I may have found one, designed for the iPhone or iPad.  Searching for 'vector-based illustration software', I came across a review for Autodesk Graphic, by Indeeo, Inc for iOS.  Comparing the feature set from the reviews to the latest feature set in the product description in the App store, I decided it was worth the $8.99 pricetag to give it a test drive.  Doing research for this blog post this morning, I found that different links have different pricing, from $2.99 - $29.99.  One thing to note - the link for $2.99 seems to be for an earlier version of the program (version 1.01, as opposed to 3.1) - so I wouldn't recommend it.

Why do I like Graphic, besides the pricetag?

Bead Sample page: trying out the shape tools and gradient fills

It's easy to use
The interface is very intuitive for anyone who's familiar with Illustrator or other drawing software.  They also have a really nice series of tutorial pages to quickly bring you up to speed on the tools and workspace.

It's quick
I worked up this little beading sample page within about 20 minutes of downloading the program, that includes reading through the tutorial pages.

It has the tools I need
I have very specific things I want to accomplish.  Can I make pretty looking 'beads' quickly?  Can I easily add a radiant fill, and change line and fill colors?  How about adding in the thread paths?  Does it have layers for additional control?  Early experimentation indicates that Graphic meets all of these needs, hands down.

It's vector-based 
This last one may need a little more explanation.  In a nutshell, the question is whether lines are rendered as a series of little dots that all happen to connect, or as a continuous line described by a mathematical algorithm.  The later creates smooth, beautiful curves no matter how much you scale the original image.  Here's an example to show the difference:

Zooming in on a .JPG and a .SVG file

For this, I exported my Bead Sample page in two separate formats, first as a .JPEG, then as a .SVG (which is a vector-based file format).  I opened the .JPEG in Photoshop, then zoomed in to 500% on one of the beads.  This is the left-hand sample, and you can already see the pixellation along the outer edges of the shape.  I then opened the .SVG file in Illustrator, and zoomed in 800% on the same bead.  This is the right-hand sample; see how nice and smooth the edge looks?  The very slight pixellation you may notice is because I combined the two samples and text in Photoshop, then reduced the size and saved them as a .jpg so that they'd download more quickly over the Internet.  

That's the key with bead illustrations - drawn them in a vector-based program, then export them in the size and format you need for your particular purpose.  While, of course maintaining your original, vector-based files as your originals.

It Exports into Multiple Formats
I touched on this above, but it's worth pointing out again.  Besides JPEG and SVG, you can also export into PDF, PSD and PNG, as well as a Graphic source file (useful if you're moving between devices).  

It supports the iPad Pro and iPencil
All the experimenting I did last night was curled up on my couch.  Drawing with the iPencil on my iPad, is a night-and-day experience compared to working with a mouse.  But even if you don't have an iPencil, I had a lot of success with simple touch gestures, and still found it much easier than working with a mouse.  

Could be used to Layout Single-Page Tutorials
Graphic, like Illustrator, is designed for single-page designs, not multi-page books.  However, within those limitations, it offers a lot of control for page layouts combining illustrations and text.  In fact, their beautifully-done Intro Guides were all created using the program.  

------

So, will Graphic replace Illustrator in my workflow?  I'll have to see as I do more experimentation.  At this point, I'm guessing that I'm going to use it to augment how I use Illustrator.  At the very least, it's fun to use and will allow me to work in situations where dragging along a laptop simply practical.  If you decide to check out Graphic for yourself, I'd love to hear what you think!  

In the meantime, I'm still looking for a viable, lower-cost alternative to Adobe's InDesign for page layout and design. 

Lessons Learned: Scrivener Writing Software

Every craftsperson knows that the right tools make the job simpler and easier.   This week, I thought I’d share a review of one of my hands-down favorite pieces of software.   It’s called Scrivener, and it’s designed to make it easier for authors to put their manuscripts together.  In truth, it’s great for any large writing project with lots of ‘moving’ parts.

Why do I love Scrivener?

1) It makes it so much easier to organize your writing.  

To organize your document using Word (or other traditional word-processors), you might create separate folders for each chapter, and then separate documents for each section in the chapters.  To edit your project, you would need to find and open each individual file.  This can mean lots of open files.  And what if you want to see how one section flows into the next. Do you copy and paste both files into a separate document?  Then what happens when you need to do more editing; which do you edit, the combined document or the individual files?  Nightmare!

Scrivener organizes all of these 'files' within one Binder document.  Here's a screenshot from an early version of my Scrivener file for Explorations in Freeform Peyote Beading. 

Scrivener file for Explorations, with my original outline in the right window

The Binder window on the left gives a quick overview all my documents 'files' and 'folders'.  I can click on any folder to see all of its files.  Click on a file and it shows up in the larger window to the right.   And if I want to see how one file flows into another?

Screenshot from early in the project

I simply select multiple files from the binder at left to view them in the right window.  A horizontal line shows the transition from one section to the next. You can see this in the screenshot above.  (I added the red annotations in Photoshop). 

Need to rearrange sections?  It's as easy as simply dragging and dropping the file or folder names in the binder view at left.

2.  Scrivener allows you to view two sections side by side. 

Scrivener allows you to view (and edit) two documents side-by-side

 This is so useful for editing! 

3.  Fantastic Tools for Printing and Compilation

When you are ready to 'print' you can compile and export the entire draft into a single Word document.  Scrivener provides a number of tools to help you easily format that document.  Checkboxes allow you to quickly select which files you wish to include when you compile your document. 

This is particularly useful for for fiction or novel-style books.  Since all of my page layout was in InDesign, I couldn't take advantage of the compile feature for the print copy of my book.  But I did use this to create separate files for the ebook versions.  

4.  You can store research inside your Scrivener document

Scrivener allows you to store and organize your background research, documents and even whole web pages into a separate section.  Amongst other things, I used the research section to store all of the text I'd received from my contributing artists, and copies of older blog posts that related to the book.  Having this information easily accessible and organized made life so much easier!

The research doesn't compile with the rest of the draft, but remains with the Scrivener file.

5.  At $45, it's Not Terribly Expensive

Literature and Latte (the company that produces Scrivener) offers a free 30 day trial for both Windows and Mac.  If you fall in love with the software during the trial, its only $45.  Compared to the other software I use, this is such a good price!  (I don't have any affiliation with Scrivener, or Litterature and Latte except as a very happy customer). 

In this review I've just barely touched on the power and capabilities of Scrivener.  My goal was to simply highlight some of their most basic and powerful features.  One of the other things I love about Scrivener is their in-depth (and FREE) instructional videos and tutorials that will quickly introduce you to so many more possibilities. 

While it's designed for writers, I've used Scrivener for all sorts of things, including storing research for upcoming trips because it's so easy to organize and access information.

Six Month Overhaul

It's amazing the things one ends up doing as a working artist.  This past week it's been website redesign.  Turns out the last time I sat down and really worked on my website, skunkhillstudio.com, was back in January, so it was definitely about time. 

A screenshot of TextWrangler in action

I've been neck-deep in HTML and CSS (cascading style sheets) and even poked my toes at a little PHP.  Love the alphabet soup!  I always forget just how long it takes to make simple changes.  I spent three hours making little thumbnails for each of my classes and trying to get the markup and CSS to look right for my Classes & Workshops page.  Then I had to check on it in several browsers, to hopefully make sure there aren't any huge surprises. 

If you happen to have a Mac and are looking for some free text-editing software to work on web pages, I highly recommend TextWrangler by Bare Bones Sofware.   It does a beautiful job of contextual mark-up; color coding the code automatically so it's easier to read.  Looking at their website, it looks like I'm just barely touching the surface of its capabilities.  But back to my web redesign. 

My main goals for this overhaul were to:

my new Classes & Workshops main page

Update Workshop pages - for some reason only a handful of the bead classes I've prepped to teach were actually listed.  Now I think I have them all there, divided into three sections that at least made sense to me - Freeform Peyote, Mixed Stitches and Right Angle Weave.  Also now have my current teaching schedule on the same page, rather than a separate calendar page. 

Update my Gallery pages, adding new work from 2012 and dividing my bead work into similar categories as the single page was growing too long.  Also, put my older fabric pieces into gallery archives (they say never delete anything from your website - along these lines one of my most popular pages is on how to set up for freemotion embroidery with your sewing machine).  The main Gallery page is still a little stark - I expect I'll add something to it, just not quite sure what at this point.  Suggestions are welcome!

Make it easier to find my Kit & Tutorial listings. This was mainly a matter of playing with different names for the navigation link, and adding a few more pages to my website detailing out what I have available.  Right now, I have detailed information about my tutorials and kits on my website, but I'm only selling them through Etsy.  I have a Paypal account, so hope to sell through skunkhillstudio.com shortly, but I want to make sure I have all the various issues sorted out first.

If you do direct sales through Paypal via your website, I'd love to talk to you about your experiences. 


Redo my Home Page.  The main page is far and away the most difficult to design, at least for me.   Other pages have a specific purpose:  Galleries, Classes, etc.  The main page needs to be a little bit of everything to everyone, an introduction page and an easy path deeper into the site.  So I ended up trying several different home pages.

The old homepage for Skunk Hill Studio

Take one on the new homepage for Skunk Hill Studio - too much text?

New Home Page, less text, blog feed & gallery links above the fold

So there it is, my new home page.  I now have the RSS feed for my blog above the fold (and discovered that RSSinclude (the service I used to add my blog's RSS feed to my website) now offers additional styling options, so I took advantage of that as well.  Also moved the gallery page links to fill the space to the right of my Fall class schedule.  Reminds me a little of the front page of the newspaper, with a headline image, then lots of smaller links to other places on the site (Lacework Leaves, read more on page 3).  :)

I've tested it in a number of different browsers, but if you happen to stop by and notice anything really wonky, would you let me know?  It's amazing the differences that can happen when CSS is involved!  And thanks for letting me share!

Blogging Away from Home

I have this dream of blogging while traveling using only my iPad2, rather than having to lug around my antiquated and heavy laptop.


It seems like it -should- be a simple dream, but Blogger's web interface for the iPad leaves much to be desired. I'm forced to work in HTML mode to type my posts (no visual editing) and in many cases I'm forced to add coding by hand.   Even where I don't have to add the code myself, I find that all the markup makes it difficult to see what I've actually written.

The image at left is a screenshot of the Blogger interface on the iPad. 

But worse than dealing with the HTML mode has been finding an easy way to upload and place photos from my iPad. This is impossible through Blogger.  The screen looks like it should work, but doesn't.  Back in the spring, before our Alaskan cruise, I purchased a camera connection kit to easily load photos from my camera and iPhone to my iPad. That worked, but Blogger on the Internet could not find my camera roll. It simply didn't work like a laptop. I finally figured out that I could upload the photo to Flickr, then link to it from there, if I could figure out the exact web address for the image (not the page), but that's too complex to be easy!

Last week I used the iPhone app 'Blogger' in writing my last post for 2011.  It allowed me to add an image directly to Blogger from my iPad or iPhone, but with only the most basic formatting, and no control over placement. Once it was placed with the Blogger app, I could bring it up in the Blogger web interface on my iPad.  There I could at least move it to where I wanted it in the text by copying and pasting the code, but I couldn't change its alignment (default is centered, with text above and below).  Nor could I add a caption without doing a lot more coding or copying and pasting from other blog posts (more than I was comfortable doing).  

So then I tried out Blogsy, a $5 app for the IPad. It does have a visual editor, as seen in my screenshot at left, though it's quite quirky when you start adding images. This paragraph ended up embedded in the image link and I had to go into the HTML code and copy, cut and paste to dig it back out, for instance.

I'm supposed to be able to able to drag and drop images around once their placed in the post, but that seems to do terrible, terrible things to the code, which I then have to fix.   Also I can align photos to the left, but when I try to align them to the right, the surrounding text follows suit. Not so good.  And I still can't add captions. (I added the right alignments in Blogger borrowing my parents' computer - cheating a little.)

Blogsy does indeed link to my camera roll as promised. Sort of. Turns out you have to set up a Flickr, Wordpress or Picasa account, then when I open my camera roll I can drag the photos I want over to Flickr. Not ideal, as I don't necessarily want these screenshots in my Flickrstream. Why can't it simply upload to Blogger?

On the plus side, I have figured out how to transfer photos between my iPad and iPhone using iCloud, so that's a win.  But blogging on the go using my iPad is still not an easy prospect! 

So I'm still hunting for a better solution.  

A silly, but fun addition to the plus side: during the search for blogging software, I've found FrameMagic Lite, a fun photo app which lets me put together photo collages very quickly and very easily.  It took me a minute tops to make this collage of photos my niece Emme took of herself using Photobooth.  The longest part was choosing between the slew of images! 

FrameMagic Lite is free.  Their paid version would give me more layout options. 


So now, do any of you have favorite blogging software for the iPad or iPad2?  One's that let you add and manipulate images from your camera roll without uploading them first to Flickr or another online site?  Especially for Blogger?

Editing my Photos for Print and the Web

My favorite image editors are Photoshop and Acorn.  At $49, Acorn is one of the best software values I know.  Developed by Flying Meat Software, Acorn has all of the functionality I need to edit my photos for both print and web, but is unfortunately only available for the Mac.  My old version of Photoshop (CS2) is licensed for Windows.  We're a mixed computer family, with both Mac and Windows, so I still use both.  But I use Acorn more and more instead of Photoshop and all of the screenshots in this post will be from Acorn. 

Editing Tools
I use relatively few tools to prep my images in the theory that simpler is usually better.  Here's my general 'toolbox':

A) Mediocre photo B) rotate 1.5 degrees, crop C) auto levels, remove smudge

Image Size - At 14 megapixels, my pictures are typically much larger than I need, so my first step is usually to resize them to a more workable file size with enough extra to give me working room for cropping and such.
Rotate - My photos are often a degree or so out of plumb.  Free Rotate fixes that in a jiffy, though I then need to crop the photo a little to get rid of the edges.  And of course, no one likes a sideways image, hence rotate 90 degrees.
Crop -There are two ways to use crop.

1. Use a selection tool to outline the area you want to keep, then select crop from the pull down menu.   



Using Rectangle Selection Tool to define crop area




2. Use the crop dialog box to specify both the pixel height and width.  I use this in the final crop when working with print media, when I want my image to be a particular size (2 inches high by 3 inches wide translates to 600 x 900dpi at 300dpi for print media).  Once I've typed in what I want, I can move the selection window around until I have just the right focus.  With Photoshop, you can also do this with Canvas Size.



Using the crop dialog box to further refine the crop









Final, cropped photo - no other editing

Levels If my original is just a little too dark, or the image appears a little washed out, levels can often help.

Try Auto Levels first - if it improves the look of the photo great, if it doesn't hit 'undo'.  Then try the Levels dialog box.  If the graph is flat at either end, adjust the sliders to eliminate that space, watch how it changes the image. 

Using the levels dialog box

Cropped and leveled photo - still dark, but better (difficult white background)

Sharpen - Use this tool very, very sparingly!  It can be tempting to go overboard here to correct blurry photos.  the final result will look flat, like an over-exposed cardboard looking image if you go too far.

A) original slightly blurry, B) sharpened once, C) too far

Adjust Colors - This is another tool that can be extremely useful for minor adjustments, but which should be used with caution.  Remember that everyone's computer monitor (including yours) sees color slightly differently, so be careful in making adjustments.  The safest way I've found to use this tool it to use the photo's background as your focus.  Make minor adjustments until the background is the color it should be, then look at your jewelry and see if it looks better too.  If not, discard your changes.

Saving My Edits

File Formats, JPGs and DPI  Most point-&-shoot cameras save their images as JPGs.  These days, JPGs work well for both print media and the web so there's seldom a need to convert your photos into alternate formats.  However, you do need to take some care in saving your jpgs if you want to maintain your photos' quality.

JPG is a Lossy File Format.  What this means is that each time you save a jpg, its compression routine throws out 'extraneous' data in order to achieve the smallest possible file size.  If you save the image several times, even without making any changes, the image can degrade visibly, especially if you save it at a higher compression rate (low quality). Get around this by:

1. Always working from your original image file.
2. Use "Save As" or "Export for Web" and save a copy of your edited photo instead of simply hitting "Save".  
3. If I need to make additional edits after you've saved your copy, return to the original file.  
4. If you think you're going to need to make a lot of changes, with saves in between, save a copy using the native file format of the image editor you are using.  This format (.psd for photoshop, .acorn for Acorn) will not compress the file and no data will be lost, but you will need to remember to do a save as later and change the file format back to .jpg before you can use it on the web or in most print media.

DPI stands for "dots per inch".  Your computer monitor projects 72 dpi, so if you're saving your image for the web, you don't need any more.  In comparison, quality printing is 300dpi or higher, depending upon the printer.  So if you want to use the same image in both media, you'll need to save two copies, each at the appropriate dpi.

Tracking photos for Freeform Peyote Beading

Tracking your Photos.   When saving your photos, come up with an easy to remember filing system to quickly find and differentiate both your original images and your edits.  It's a sinking feeling when you realize you've just saved your only copy of your original photo as a 100 x 100dpi thumbnail.

For my book, I put together a spreadsheet to track my photos.  Originally intended to pair raw with edited photos in case I needed to make further edits, the spreadsheet also became useful in page layout - helping me keep track of my required dimensions when searching for just the right photo.  While it's not necessary for smaller projects, it was a huge time saver during the later stages of the book production as I worked to massage the page layouts into shape.

What Image Editors Do You Use?
I'll admit to being curious as to what image editors other people use, especially editors with a more reasonable price point, like Acorn.  Feel free to leave a comment and share.