Search

Librarian Design Share

inspiration for library creatives

Author

Jess Denke

Assessment and Outreach Librarian at Muhlenberg College

When Design Begets Design

I personally love creative projects that build upon one another.  That’s one of the reasons that this poster from Jessica Richmond and Kate Transue of the Bucks County Free Library is so cool – digital designs became patches became a great poster presentation at the 2018 Pennsylvania Library Association conference.

badge squad

The library contracted a graphic designer to custom create the digital badges and the utilized The/Studio to print them on fabric.  But they weren’t done utilizing the designs!  Jessica wrote,

Our poster introduced how our library system successfully revamped an online program to create year-round in-house programs.  We already had graphics that were used to create fabric patches as incentives for the programs, so we knew these would be a focal point.  We also wanted to use one of our library’s branding colors to create a clean, consistent design, so we chose blue to complement the graphics.  Using a tri-fold layout helped us organize the information.  The center panel became the conversation starter and featured the basic concept of the programs, the graphics, and the skills & outcomes while the two side panels went into detail about the background, development, and specifics of the programming.  Instead of signing the poster with just our names and titles, we included a photo of us giving a thumbs-up next to our library’s logo.  Not everyone noticed this detail, but we definitely saw smiles from those who did!

Jessica and Kate utilized Canva to make their poster.  They described the experience as “user-friendly” and “modern.”  Jessica and Kate utilized a few Canva features to create this clean design.  The first feature they highlighted was the ability to create custom dimensions in order to fit their tri-fold display.  They also mentioned that their library has saved their branding colors as a palette within Canva and so color selection became even easier.  Jessica and Kate were happy with their Canva experience.  However they noted,

Our only complaint was the lack of a ruler and/or gridlines to see exactly where everything lined up. We did end up downloading the poster a few times and pasting it into Publisher to make sure the panels would be exactly centered. Otherwise, we were very happy with the choice to use Canva, and even happier with the result. The print itself also turned out incredibly clear because we were able to use the custom dimensions.

Kate and Jessica’s design story demonstrates the techniques that we often use to accommodate our tools or abilities.  When your design desires overcome your capabilities, it may be a good option to ask for help!  Their library’s investment in great graphic designs provided great reward.

Jessica and Kate’s design can be found on our Google drive.  Remember, all submitted work will be published on this site under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported license.

Advertisements

Design for Accessibility: Writing your content

One important principle of web accessibility is also a lesson I learned from my mom:  use your words.    Thanks, Mom!  In web accessibility, this principle applies to the writing of web content and in the description of images through the use of alt text.

Think about the difference in these two sentences:

  1. Librarian Design Share is doing a series on accessibility. Read our first post here!
  2. Librarian Design Share is doing a series on accessibility. Our first post outlines the importance of checking the accessibility of colors for flyer and web design.

All I tried to change was the language to which I attached a link.  Instead of using an ambiguous “here,” I used language that describes the landing page.  This way, users do not have to guess what resources are available to them by context clues.   I think that abiding by this principle also results in more interesting content!

Similarly, when using images in your web content, it is important to fill in that alt text field.  Alt text is the content that assistive technologies will read to users, and by ignoring that field you are, in essence, excluding those people.  It is important that the alt text is descriptive of the image, and highlights the important pieces of information contained within.

a screenshot of alt text editor

You might try and argue that the images you include in your web content are just for decoration.  By failing to fill out the alt text field in these circumstances you are denying people your expression of playfulness, beauty, nuance.  However, there are other situations where failing to include alt text would decrease the important information available to your readers.  For example, how often do you upload a .jpg of a flyer with event descriptions, dates, and times?  Without including this information in another place on the page or within the alt text, this information would be lost on the visually impaired.

So remember my mom (or yours!) next time you’re creating web content and use your words!

Design for Accessibility: LibGuides

Library resources can be hard to locate, but all of the university libraries I have worked at have used Springshare libguides, called help or subject guides, to make resources more visible to the public.  Perhaps yours does too!  If this is true, I have one tip for great libguides:  design for accessibility.  If you design for accessibility, your guides will be better for everyone.

While the intention of libguides is to make resources more easily found, they can still be a significant hurdle to individuals with sight impairments or literacy challenges.  Thanks to Springshare, the solution is actually quite simple:  use the information structures available to you.  First, create boxes with names that help students identify what information will be found within.  Using headings like “Finding background Information” and “Finding scholarly articles” will help students identify where to find the information they need.  Then, within these boxes, choose the correct information type or structure.  If you are including a link, use the “link” structure – the same goes for “database” or “book from the catalog.”

Why is this useful?  Because assistive learning technologies, like Kurzweil, utilize the hierarchy of data structures to allow users to skip from one to the next quickly.  Therefore, if a user is interested in finding scholarly journal articles they can easily skip past the box labeled “Finding background information” and go to the box titled “Finding scholarly articles.”  If they know they want to search in Worldwide Political Science Abstracts they can easily skip through the other databases listed.  The alternative to this quick hop through information resources is a comparatively slow process of listening to a lot of text in order to find the desired resource.  I’ve seen this many times – librarians commonly select to use the “Rich Text/HTML” structure, which allows you to include text, and links, at will.  The lack of structure in this kind of content makes it inaccessible and unwieldy.

One of the nicest information types to use is “book from the catalog.”  By allowing users to paste the ISBN number for a book into the proper field, Springshare automates and standardizes the rest of the bibliographic information included in the recommendation.  This is also important for accessibility – individuals can learn a significant amount of information without having to leave the page and the standardization allows users to anticipate what information to expect on the page. Utilizing this information structure also makes your guide look nice!  The cover of the book can easily be included, and the visual element breaks up the text-heavy guide.

accessible libguides

Revising libguides to abide by this accessibility principle provides great value to the library’s user community.  If your library uses another application to direct students to resources, take a look at the structures available or be sure to utilize the correct html element in your guide creation process.  Leveraging the hierarchy of guide design and descriptive elements of html can make a huge difference for the access of individuals with differing needs.

 

Refreshing Library Documents

Updating document designs can be difficult – old files can be lost or saved in formats that cannot be edited.  Muhlenberg College’s Trexler Library determined that our floor plans needed a redesign, and Public Services Assistant Stephanie Hanni was up to the task.  She describes her process:

I started with updating our logo, which was long overdue. First, in order to make any changes, since I was dealing with a flattened image that someone else had created, I had to add small white squares to everything I wanted to change.This effect would give myself a clean slate. You see, with flattened images, you can not simply erase things that you want to erase. So, in Publisher I created a white square (which is located under the INSERT tab > click on SHAPES). This gave the illusion of erasing the items that I wanted to replace. Then, I just added the new image (i.e. printer) on TOP of that white square (to make sure the image comes to the front, go to the FORMAT tab > click on BRING FORWARD). This process can be painstaking, especially if there are odd shapes were a square may not cover everything. You could use a white circle or even triangle, depending on the need. To create the top and bottom parts of the maps, all I did was insert a RED and GRAY square and stretched them to fit. I created a few layers to give the top a ‘striped’ effect. Lastly, all the images I found were through Creative Commons. I made sure that they had a transparent background, and just simply inserted the images into Publisher and sized them to fit. This was a simple, easy way to give the library maps the makeover they deserved.

The floor plan directs library patrons to collections, work spaces, help desks, and offices.  It can be found on the library’s website and throughout the building.

Library Map Redesign (2018 Level A).jpg

Thanks to Stephanie for sharing her process and final outcome.  Stephanie’s floor plan is available on our Google Drive. All submitted work will be published on this site under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported license.

Inspiration from the Public Domain

Recently my design work has been inspired by artifacts that are in the public domain.  Though I love design, I am less inclined to try my hand at drawing or painting while at work.  Thus, the great value in images that I can use, modify, and distribute without fear of copyright restrictions!

Many of the students at Muhlenberg College are also involved in creative projects with include visual elements, so I’ve been talking to them about copyright restrictions and encouraging them to take a look at items outside traditional copyright.  I’ve also created posters utilizing Adobe Illustrator and Photoshop to encourage student understanding and use of artifacts in the public domain.

 

These posters hang outside my office and are also included in a library subject guide that I’ve made with lists of open resources that creatives can use in their own work.  The posters both exemplify the work that can be done with images in the public domain and draw the eye.  My inspiration drawn from the public domain hasn’t ended with poster and subject guide creation.  I’ve also created a zine, which (while entertaining) I won’t share here since it doesn’t fit the Librarian Design Share mission.  However, if you’re interested, you can find it on my blog.

I am happy to share these posters on the Librarian Design Share drive.  Please distribute them as you please – the joy of these resources are they they are available to all!  And, if you find inspiration from the public domain and create a design for your library, please share you work with us!

Upgrading the Annual Report

At the end of every year, library stakeholders expect an annual report.  This tends to be a lengthy document given to administrators and includes numbers and graphs and reflections on library success.  My question is: do they even read them?  

Today I’m happy to share with you a submission from Daisy Ngo, a Public Service Librarian at the Houston Community College Libraries, which creatively re-imagines the annual report.  Ngo and the Marketing & Public Relations Committee at HCC Libraries  utilized Canva to create graphics and the annual report will never be the same.  Ngo says that these graphics  “have been a hit at [their] promotional tables during faculty events such as Instructional Day and Faculty Conference.”

student success infographic.PNGyear in review.PNG

 

One of their most creative creations is a graphic on the cost of a research paper.

cost of report.PNG

We asked Ngo to tell us a little bit more about her experience with Canva.

The experience with Canva has been great. I’ve recommended it to colleagues, created documents for instruction, and used it in personal life. Creating in Canva has increased the Marketing & Public Relations Committee’s ability to create and communicate our vision with the institution’s communication department. HCC faulty now have access to Adobe InDesign, the learning curve is much greater so I still use Canva regularly.

In case you’re wondering about the limitations of the free version of Canva, we asked about that too.

I believe that constraints can spur creativity. That being said, I like the design options, many are free but there are a few premium options for layouts, images, and elements. The ability to manipulate templates allows for non-designers to create projects without much effort. The only downside to the freemium version is that projects cannot be resized so repurposing graphics means starting from scratch. Overall, I have been able to find both formal and fun options for various projects without having to upgrade.

Thanks to Ngo and the Marketing & Public Relations Committee!  You are able to find this design on our Google drive.  All submitted work will be published on this site under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported license.

Outreach Using Buttons

A recent article in College & Research Libraries News discusses outreach opportunities through button making with students as “low-cost, high-impact,” (Lotts & Maharjan, 2018) and I couldn’t agree more.  Students love buttons!

Today’s button submission is from Leanne Gallety of the Davis Family Library at Middlebury College.  Leanne says,

Working off a limited budget and inspired by ‘So Many Buttons,’ I created a set of buttons to give out to students at the reference desk and during instruction sessions. I wanted them to be fun and something students might actually want to put on their backpacks, so I tried to stay away from our traditional branding (for example, we often direct students to the URL of the library website) and brainstormed for some puns that might work. We have a subscription to The Noun Project, so once I had a couple of ideas, I just picked some icons from their library and downloaded them as .svg. I mocked the buttons in illustrator to random dimensions and conveniently, Pure Buttons offers a free template for their buttons, so I could size up and preview at scale. With this template, I saw there was space to add some text along the rim of the button, so I decided to include the library name and a link to contact a librarian, in case anyone’s looking really close.

The text on the side of the button is a nice surprise to forward the library’s outreach mission.

side of button with text go/askus

Thanks to Leanne for sharing her tools, process, and product.  Remember that Leanne’s buttons are available on our Google Drive. All submitted work will be published on this site under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported license.

Combine Display and Flyer Design

Here is an interesting design from Rainer Rees-Mertins, who works at Lib4RI-Library for the Research Institutes within the ETH Domain: Eawag, Empa, PSI & WSL in Switzerland.

survey

Rainer created the flyer in order to get community feedback on the library’s services. The flyer contains a QR code that leads directly to a survey and survey information on the back.  Community members were encouraged to take the flyer directly from the display.  I think that this is a cool, interactive display idea!

Rainer says,

…the flyer consists in Indesign of four swatches in standard postcard format, into which the print version was then cut. We placed the four flyers next to each other so patrons could read “Survey” already from pretty far away and they could take a flyer nonetheless. However, we also used the flyer as a whole for online materials to advertise the survey.

Rainer was also intentional about the colors that they used when designing the display.

The colours in the background are an enlarged version of our logo (see back of the flyer for the logo). I try to use these colours as often as possible for designs I make, because of the recognition value. What I liked especially about the flyer was the shift in the font colour from white to black in the “U”.

Thanks to Rainer, you are able to find this design on our Google drive.  All submitted work will be published on this site under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported license.

 

Sign Design: Branding through Consistency

Determining how to attract attention to signs can be a struggle.  Each sign is carefully crafted to draw the community’s attention to a particular announcement, but when there are too many signs the effect may be the opposite.

Linda Kramer of the Martin Luther College Library in New Ulm, Minnesota navigated this predicament by varying sign messages and colors but maintaining a simple, consistent design.  She submitted a series of Canva signs that she made when she realized that students weren’t aware of the names or locations of library services.  She used anecdotal evidence to determine what to highlight.

 

0001-959337792

Linda says,

My goal was to allow each sign to be read in two ways: using all of the words, or using just the white words. Because one iteration of each sign was placed on digital signs around campus, the language needed to be easily read in a few seconds while students are walking past the signs. It was fun to try to come up with wording that could be read in both ways, and I think it worked well, except for a couple where the punctuation got in the way.

0001-524891325

In describing the project, Linda noted that she rotated the signs on digital displays around campus, hoping that the alternating colors would catch the eye and the consistent style would be associated with the library.

You can download all twelve PNG posters from the Librarian Design Share Google Drive, and you can contact Linda with any design-related questions.

Blog at WordPress.com.

Up ↑

%d bloggers like this: