Resources

Planning this hackathon

Hackathon Affinity Board | Hackathon Timeline and Roles

Digital Design Inspiration

Our Mood Board | Web Layout Lab Experiments | Twitter Collections tweets in a grid “hero” format | Twitter Collections grid format example

Wireframes

Home Page Concept | Create Profile Concept | Magazine Style Layout Concept

Logo

Voting | Results

Fonts

Google Fonts | Open Sans | Montserrat | Noto | Pathway Gothic

Colors

Open Color palette (deuteranopia and protanopia friendly) | Material Design color palette

Web Accessibility

Contrast Checker | WAVE web accessibility evaluation tool

UX DESIGN MATTERS website

https://uxdesignmatters.org | admin | Dreamhost Panel

DEV Environment

Bitbucket repo |

SFTP: “sftp://uxdesignmatters.org”, user: “uxdesignmatters”

Craft CMS

Docs | Nav Structure | RSS Feed Generator | Twig Template | Happy Lager - Craft CMS Example Site

Polymer

Docs | DEV Quick Tour | Useful Services | Examples | Code

Useful Polymer Web Components

iron-ajax | iron-input | polymerfire

WATCH: Using Polymer iron-ajax and two-way data bindings to call other REST APIs

Firebase

Docs | Admin Console | UX Design Matters DB

TUTORIAL: Polymer and Firebase Code Lab

Meetup.com

REST API Docs

Useful Techniques, Snippets, Plugins

Responsive Image Breakpoints Generator

Slick Carousel / Slider for jQuery

Pure CSS Parallax scrolling websites

Highlight current nav while scrolling down page

Progressively Enhancing Your Form Inputs

This is the basic process we will follow in styling our website… Web Design In 4 Minutes

Useful Tools

HTTPBIN - useful for testing your AJAX calls or form submissions

FIGMA - real-time collaborative prototyping tool

Content Ideas

UX Self Assessment Sundial