Skip to Main Content
It looks like you're using Internet Explorer 11 or older. This website works best with modern browsers such as the latest versions of Chrome, Firefox, Safari, and Edge. If you continue with this browser, you may see unexpected results.
 

The Flipped Library Website : User Created Design for an Academic Library

In late Summer 2014, the State College of Florida asked users to draw what they wanted their website to look like. This is for the SpringyCamp 2015 "Building Better: Thursday, Nov. 19 Today is all about using Springy Tools to build a better user experie

The Flipped Website Resources

Tools to Develop and Evaluate Bootstrap Skills and Designs Rapidly

 

Lynda.com

Low Cost. While there are many free videos on learning Bootstrap, I found the ordered careful pace of Lynda.com videos to be pedagogically sound.  They include key learning practice sections and build upon newly leearned skills. 

 

GetBootStrap.com

Free.  The components section is a highly replicable section showing common Bootstrap elements, such as, the Jumbotron, Thumbnails, Panels, Responsive Embeds, Dropdowns, Navbars and more.

 

Bootsnipp.com

Free. A fantastic Bootstrap and code playground. Allows testing of HMTL, Bootstrap, CSS and Javascript all in one place.  I use this to also shop for new elements and components.  It is the Pinterest of Bootstrap code. "Snipp" what you want and customize. 

 

BeFunky.com

Free and Low Cost.  I don't have access to Photoshop.  I do use PowerPoint images often.  However, when manipulating images quickly, this is my go to product.  There are many free manipulations and design upgrades.  

 

Unsplash.com

Free.  Free to use Creative Commons Zero licensed images.  High definition and high quality. Subscribe for weekly updates.

 

ColorCombos.com: Extraction Tool.

Free. Use to expand your design color palette. Just use URL.  There are many similar sites online that work from JPGs, URLs and other methods.  Google Color Swatches generator.

 

Wave.webaim.org

Free. Web accessibility evaluation tool. 

 

Squarespace.com/customers

Free. Squarespace uses many design elements that are available via Bootstrap.  Review it for inspiration.

 

SmashingMagazine.com

Free. Highly readable online magazine covering coding, design, mobile, graphics and UX Design. They offer many pay seminars, but their content is free.  Keep up with the UX section. It is often provocative. 

 

GoogleAnalytics and Google Analytics Chrome Extension

Free. Make sure to add Google Analytics to guides.  Analytics provide more than just click-throughs, but referals and pathways. This is invaluable information for the design evaluation process.  By adding the Chrome extension, you can view in page stats on every page.  This is a great way to test wording, position and the dead zones in your design.