Posts filed under ‘Design’
The message here is a simple one — if you need a clear answer, a library is a great place to start. Made in Inkscape, the premier open source design tool.
Thanks to Marie Radford’s suggestion, I’ve created another version that has a larger worldview. Thanks, Marie!
Posted by John LeMasney
I’m really upset by the recent proposed budget cuts in New Jersey that will reduce or remove internet access, databases, programming, and many more useful services from New Jersey Libraries. I’m upset that the new Administration finds certain things far more important than these services which have helped me to raise my children, become part of a community, and support my recent MA in Organizational Leadership. I’m upset that many of my friends in LibLand will lose their jobs, go without professional development, and have to divide already thin resources. With this development, I have revolution and revolt on the mind, and in our country, we have the right to speak out on that which we disagree with. My symbol for this is a bullhorn, a tool for rallying cries, to gather and direct people towards change, and to broadcast ideas and reminders about why we should be outraged.
In Inkscape, I built the bullhorn mostly via the Bezier tool. I added flames with the Bezier tool. I added a handle with the Bezier tool. I created the central horn with the Bezier tool. I created the trigger with the pencil tool. The piece of text is from the Showtime series The Wire, in which one of the main characters says “Heard?” in such a way as for it to be almost a half syllable, and it means essentially “Do you understand and comply; if not, we are going to have trouble.” Anyway, a fun sketch about a very serious topic for me. If you love your library, tell someone — shout it out.
Post by John LeMasney
Posted by John LeMasney
Yesterday (March 14th) was Pi day in Princeton, a celebration corresponding with Einstein’s birthday, and I saw (a little bit too late, I’m afraid) a suggestion from Janie Hermann to repost a great article which I sent her on “10 amazing life lessons” that one could interpret from Einstein’s quotes.
The article is at http://www.dumblittleman.com/2010/03/10-amazing-lessons-albert-einstein.html and the ideas from that article are listed in this illustration here.
In keeping with my visual posting plans for LG, I used Inkscape to make this image. I started with the famous Lucien Aigner image of Einstein at a chalkboard, and bitmap traced it in grayscale mode with 4 layers, which results in a posterized, if very recognizable image made out of points and lines. I extended the blackboard and using the calligraphy and gradient tools made a smooth transition between what’s in the photo and a gray neutrality. Then, I took the content of the post and laid it out in the right side of the image.
Thanks Albert, for all you brought to our lives. Thanks Lucien for the great image. Thanks to Janie for the suggestion. Thanks to you for taking a moment to remember Einstein with me.
Related articles by Zemanta
- Happy Pi Day & Happy Birthday Albert Einstein [Moment of Geek] (buckdaddyblog.com)
- Pi Day and Thinking About “Pi” (lockergnome.com)
- Albert Einstein: birthday greetings (scienceblogs.com)
Author: John LeMasney. As a supporter and fan of libraries and librarians, I find it a privilege and honor to be able to post on Library Garden. I also sometimes find it just the slightest bit intimidating. I’m always just a little bit reluctant to post something that I think might be too far outside of the librarian’s perspective. At the same time, I’ve been working closely with libraries in New Jersey and elsewhere for the last 3 or 4 years as a presenter, trainer and consultant, and I love the topics that I’ve been able to put into my personal Venn diagram with Libland.
Topics such as technology, design, blogging, open source, outreach, and learning all have been focus points for my work with libraries, but my favorite by far has been design. As a result, for the posts I’ve created here at LG, I’ve made them about design. In order to increase and maintain my posting numbers here, I’ve decided that I’m going to not only write about design, but to actually do relevant designs for this blog. As inspiration, I’ve discovered many pages of quotes about libraries, learning, media, and librarians that I thought would be the perfect muse for illustration.
This is the first of what I hope will be well received posts in this vein. Mercier’s quote here about indelibly learning that which is pleasurable rings very true in my experience, and I thought you, dear reader, might agree, so I’m sharing the thought with you.
This was made in the open source illustration package called Inkscape. I typed out the quote in several single word blocks in order to have the most flexibility with their placement and manipulation. I kerned each word very tightly, as to add some speed to the reading. The font, one of my all time favorites, is Gill Sans. I added several rectangles overlapping in the background, in various woodland hues and tints, and then converted them to paths, so that I could add curves to them. Finally, I added translucent gradients to each of the blocks to create a misty effect.
You might wonder (or at least that’s my nagging suspicion) how this relates, exactly, to libraries. I’d say that if you do design in your work of attracting patrons to programs, and maintaining posters or fliers, that it very directly relates to you. I’d go further to say that if you’re using Word or Publisher to do that work, you’d have a rather difficult time of doing this particular design there, despite the fairly simple design. Even if you don’t recognize doing (or feel that you) design directly in your work, I’d argue that everyone who faces a blank page on a screen makes design decisions. That’s probably you.
Part of the message I’m trying to send is that some of the best tools in life are free (as in cost, and in freedom) and that with just a few key skills, you can greatly improve your designs. Another part is that what we learn with pleasure, we never forget. Another part is that I firmly believe that design can change your life, bring you pleasure, and alter how you see the world forever.
Hi, all. I got an email recently from an attendee of my (which I’ve had the pleasure to give on behalf of a few of New Jersey’s finest Library Consortiums). This attendee asked how I had performed a particular effect in Inkscape during the workshop in which I use a bit of text as a brush in order to render a portrait. An example follows: and workshop
Instead of writing out the answer in text (I myself am a visio-audio/experiential learner, and tend towards those kinds of solutions), I decided to use the question as a starting point for an entry in a daily project I’ve been working on at http://365sketches.wordpress.com, in which I’m trying to make a quick sketch a day in 2010 using free software to demonstrate the power of those tools.
You may want to check it out from time to time (or subscribe to the feed, if you’re into that kind of thing) to get ideas for how you can use free software like Inkscape to create interesting designs for your library’s fliers, posters, and other advertising materials and platforms.
At any rate, I made the following screencast to demonstrate how I make images like the one above. Enjoy, and if you have questions, I’m happy to answer them in the comments!
Related articles by Zemanta
- 41 of 365 is how to make a text based portrait in #inkscape (365sketches.wordpress.com)
- How to solidify your visual brand and identity (librarygarden.net)
Hi, everyone! One of my favorite librarians and open source advocates (Nicole Engard) just Tweet DMed me and asked if I ever shared officially the tools I mentioned in a discussion session on Presentation Tools and Techniques at Pres4Lib at Princeton Public Library. I replied no, with regrets. I figured if she’s wondering about it, maybe you are too!
By the way, if you like our articles, please share them on Twitter, Facebook, and anywhere else you like.
I use a pretty well structured, personally vetted workflow for developing presentations and blog posts that involves developing an outline, collecting images, preparing images, research and citations. Let me share some of the tools that I use to accomplish these tasks just about every time.
Google Docs Presentations
I stopped using Microsoft PowerPoint a few years ago and have not looked back. While I would consider using the open source alternative of OpenOffice.org’s presentation tool, by instead choosing a presentation tool in the cloud, I get the ability to edit and present anywhere where I’m connected, the ability to edit offline with Google Gears installed on Firefox, the common ability to add images, draw pictures, embed my slideshows (!), allow people to automatically see the latest greatest embedded versions of my presentations up to the second after I’ve updated them, allow for collaboration and co-viewing and if I absolutely must, export to a PDF for offline sharing and presentation disaster backup. I can even make a PPT for someone who insists on it.
I typically log in to Google Docs, create a title slide for my topic, and then immediately develop an agenda slide, which I then begin to outline with the topics (and slides) that I want to cover in my talk. My style emphasizes simple broad topics which I elaborate on in spontaneous ways. I try to keep the number of words on slides to an absolute minimum. I usually make a slide for each of my topics, and I then try to look for stories, photos, and illustrations that lead the people in the audience to start thinking about my topics before I introduce them verbally or textually.
Creative Commons vetting via Google Image Search
Google Image Search is far and away the best image search tool I’ve come across (with the ability to search for line art, faces, and by color, etc.), especially now, since the recent addition of the license search feature in the advanced image search tool, which allows me to search according to Creative Commons licenses applied by designers and photographers to their images all over the web. This is especially important for me because I don’t just want to just use other peoples’ images in my work without their consent. I want to respect the wishes of image creators. By using the license restrictions, I can quickly find images available for commercial use, images allowed to be modified, images that simply require attribution, and even images in the public domain.
When we respect the rights of creators and innovators, and celebrate others’ work properly, I believe we engage in modeling important aspects of information literacy, if not common humanity.
I’ll search for a topic keyword, often choosing CC-attribution licensing, which allows me the greatest flexibility with which to use the images, to modify them, use them in commercial situations, and promote creative commons licensing, while simply being required to include attributive references to the original image author. I will very often name the file locally with the name of the author of the image, in the format “by username.jpg” or “from nameofwebsitedotcom.jpg” so that I have a built in back-reference.
Once I have the images I want to use in my presentation saved to my local hard drive in a project folder, I often need to tweak, categorize, combine, title, tag, and integrate the images. While I can do this in a myriad of different utilities, tools, and applications, none of them have quite the combination of speed, comprehensive toolset, ease of use, functions, smoothness, or slickness of Google’s Picasa. Once you have downloaded and installed this free tool, you can use a Google account to store images in free named online galleries and keep them synchronized for free. With the number and variety of images I work with in my design and presentation work, I am thrilled that I have Picasa to help me wrangle them all.
I use it to tag, group, move, geocode, describe, upload, tweak, collage, print, and watermark my images for presentations, design work, papers, and everything else. It is a free, versatile, and irreplaceable tool in my personal tool set.
Zotero is a Firefox extension that allows for the single click based collection, categorization, tagging, editing, and even full text storage of web based database entries, books, articles, presentations, images and other standard citable sources. The amazing thing it that it automatically recognizes and collects metadata when it is present in a form that Zotero understands. This might sound like a difficult thing for content providers to implement, but all I had to do to make my WordPress blogs compliant was to install a single metadata-providing plugin (COinS) that offers my name, the title of posts, the publication date and other automatically generated metadata in blogging to Zotero users. Other sources who provide the relevant metadata to Zotero include major scholarly databases like Ebsco, newspapers like the New York Times, online booksellers like Amazon, and blogs and wikis around the world.
If I haven’t hooked you in to using Zotero yet, did I mention that with two clicks, you get properly formatted bibliographies in APA, MLA, and other citation styles? After I’ve visited books on Amazon and collected their data, or after I’ve found articles on Google Scholar and collected their data, or after I’ve grabbed creative commons licensed images from Flickr and collected their data, I can simply select all of them in my Zotero database, right click, and choose “Make bibliography from selected sources” which I then choose to send to clipboard, then paste right into my final slide, reference area of my paper, or wherever else I need to respect copyright or usage license. It is also a phenomenal way to meet the requirements of CC Attribution.
Number 5, QuoteURLtext (https://addons.mozilla.org/en-US/firefox/addon/4292) is another Firefox Extension that does one thing, but does it exceptionally well. It copies the highlighted text on a page along with the date and time, URL, and page title to the clipboard so that you can easily paste some casual piece of information (such as a tasty tech tip, a quick statistic, a delicious quotation, or a little known fact) into a slide, paper, or post without having to go so far as to reference it in APA style. It’s like a casual little sister utility to the powerhouse that is Zotero.
<Jeopardy Daily Double Music> Bonus Tool: Zemanta: </Jeopardy Daily Double Music>
Finally, Zemanta (a play on semantic) is another Firefox extension that shows up in a sidebar when you are using supporting applications, such as Gmail, Blogger, WordPress, and other applications (check out their site for more). I desperately wish it worked with Google Docs Presentations, but nothing hints at that yet. Here’s why I care: All of the photos, captions, tags, post story articles, and even some of the links to referential sources were all suggested, generated and placed with a single click each using Zemanta. As I type, Zemanta autoscans sources with CC licensed imagery, content, and resources related semantically to my content. Let me reiterate: As I type. All I need to do to add it to my post is simply to click. Clickety-clickety.
A pleasure to speak with you as always, I hope you learn to love these great free tools for developing your presentations just as much as I do.
Related articles by Zemanta
- A Simple Way to Specify Image Licenses (thaibrother.com)
- Back to School: 10 Must-Have Firefox Extensions for Students (mashable.com)
- 10 Browser Based Research Tools (imakethingswork.com)
My name is John LeMasney, and I love libraries. I’m the newest blogger on Library Garden, and I’m thrilled and honored to be here.
I’m a technologist, father, open source advocate, artist and designer, and I’ve been known to wax poetic about beer from time to time. I’ve been told by Ed Corrado, one of my favorite librarians, that I should start looking at an MLS. I told him I’d maybe think about it after I finish my Master of Arts in Organizational Leadership later this year.
I was invited to join Library Garden despite the fact that I have no MLS, I think, because I have a regular beat in the New Jersey library consortia, have many good friends who do have their MLS (many of them co-bloggers here) and I also tend to spend a lot of time in libraries.
As the newest blogger for Library Garden, I wanted to give a kind of gift to my fellow bloggers in the form of a new header for the blog. Peter Bromberg’s original header was simple, elegant, and straightforward, but he asked me if I wanted to take a shot at making a new one. I have given workshops on design for Peter, and others here, so I figured that it would be a good way to show some of what I know about design, as well as present a thank you gift to the group.
My process for design usually follows the procedure I’m about to record here, and it is how we came to our new header you see in our blog. You can click on any of the images in this post to see a full sized version of the image. I encourage it for the alternative headers, since it’s difficult to see the detail in the thumbnail.
Using the open source illustration application named Inkscape, I show the name of the organization in a list of fonts for the stakeholders that I think speak to the feel of their brand. I usually present a list of at least 5-10, but it’s not a set number. In this case, I shared the following image, which went a little further than simply listing fonts and had progressed to forming word-form relationships, which is typically a secondary process. Since I had access to the original header, I included it for comparison. No kerning or other fine tuning is done at this stage:
I got the feedback pretty quickly that people preferred the second and fourth design. They liked the boldness of Library in #2 and the finesse and softness of #4. People were positive, respectful, and kind and that always makes for a better design project. They said they liked the font used for garden in the 4th option, and might like to see it paired with other fonts.
I wanted to respect Peter’s previous work, celebrate the brand that is Library Garden, and above all respect the opinions and feelings of the stakeholders. I hope that I did that, and I am very happy with the work that we did to come up with this solution together.
In order to clarify what I was hearing, I sent out a revised picture of three options in which the less popular options were removed and a new option was generated making use of what was learned in the first round. That looked like this:
This set brought the garden font into focus as a definite, while showing that the great Gill Sans, one of my favorite fonts and shown in the first two options, as well as in the final result, had the versatility to provide the boldness that people were looking for in the third option.
Once we had our wordmark it was time to begin developing a background for the header on the blog. I decided to emphasize the garden aspect of Library Garden, relying on luscious foliage, summery greens, and deep layering.
I wanted to try to evoke the depth of information and directions and ideas available at your library. I wanted to show people the complexity and richness of their options when they walk in and sit down and talk with a reference librarian, for instance. I also wanted to try to celebrate the work, history, and richness of my fellow bloggers on this site.
So, if you feel that the work I’m about to show you is kind of busy, keep in mind that complexity, richness, layering, and depth were my goals. I didn’t want you to look at the header so much as dive into it.
With that said, let’s look at how the first header option came about. Note that at this point, I didn’t intend any longer to edit the text based information, and so I converted the text to paths in Inkscape. This makes it easier to nudge and relate letterforms and other elements. I tweaked the wordmark we collectively chose by fixing the kerning (space between letterforms) and exported it as a PNG in the exact size of Peter’s original header.
I opened up the GNU Image Manipulation Program (GIMP) and imported the wordmark, and then I added 3 transparent layers, named close, middle, and distant, so that I could add my visual elements in a layered way so as to build depth. I also duplicated the wordmark layer so that I could create a blur based glow effect to make the workmark pop up from the busy backgrounds. I saved it as a native GIMP XCF file to preserve the layer work and named it header template.xcf. Then I saved it as header option 1.xcf and began working on the first header possibility. I started with the template each time so I wouldn’t have to start from scratch each time. Templates are great, but I encourage you to roll your own, rather than relying on someone else’s.
In retrospect, Option 1 is seen as the most tame, minimalist, straightforward, and quiet. None of these are bad things. It was early, easy play with greens and foliage brushes, and was intended really just to get my ideas out of my head and onto the screen. I worked back and forth between the layers, adding blocks of color in the deep layer, and thinner, more crisp elements in the foreground. Most of my objects and shapes are available to me as brushes I used from online brush sites such as those I bookmarked here. I thought of the process as though I was building a garden landscape scene, starting first with broad deep dark strokes, then building on top of that with thinner, more careful, contrasting details. My palette for this option was deep grass green, grayish midnight fields, moonlit patches, and a bright orange for contrast. People thought it was okay, but they liked the second option much more. So much more in fact, it almost got the nod.
This one brought in much more of a Chinese influence — It was very much like option 1 in that it was mostly greens and greys, but it allows the eye to focus on the bright beautiful sunny flower peeking out, and is balanced nicely with the red signature stamp, both of which are parts of free brush sets, as well as most of the tree and foliage shapes you see. I would say that this option was a favorite for many. As I finished each option, I’d send out an email to the group asking for guidance and feedback, and they didn’t disappoint.
Options 3 and 4 were simultaneously my favorites and the group’s least favorites. They consistently ended up at the end of the list of one’s preferences. They are both quite busy, very technology imagery driven, go deeper into what I think is an modernist color theorist’s palette that’s I’d call sporty, and are energetic to the point of dizziness.
I love them both, but they were obviously (now) not the best choice for representing this group. I think I like their painterly style, deep layering, and rich color, but they’re not especially garden-y.
Perhaps the most important thing in design is knowing how to listen to your stakeholders, and being receptive to the survey even when it forks with your own feelings. I’m glad I made these options in order to provide contrast, offer other options, expand expectations, and most of all, in order to go a little too far. It’s hard to know when something’s right unless you’ve seen it go wrong, or at least wrong in the eyes of your stakeholders.
After hearing feedback at each new option, I learned that these people wanted clarity, simplicity, legibility, some energy, some calm, garden-ness, lush vegetation, and that no matter what, these were all okay — they’d all do the job. That’s reassuring when your client says no matter what, they’ll be happy. With that, I tried to pull all of this together in a final option, which ended up being the one that took the prize.
The only concern was that no one, including me, knew what the block and character in the lower left translated to. As a result, I decided to remove and replace them instead of potentially upsetting someone with the interpretation of the character. I replaced it with a postmark from a set of very cool stamp related brushes, and soon after, the header was in place.
I want to take this opportunity to say thank you to my fellow bloggers for their patience in the process, for the opportunity to collaborate and create together, and for the opportunity to have another great place such as Library Garden to share ideas. I feel very welcome here, and I’m looking forward to my our next post.
Submitted by: John LeMasney.