Advan.
io
Full Stack Development | Industrial Design
Barry Bankhead
Welcome
Hello, welcome to my personal site, advan.io! Beginning April 2015 and finishing in October 2015, I attended the immersive Galvanize Full Stack program.
The three projects to the left represent a picture of my progress from roughly week 7 in this course, up through and culminating with my Capstone project, CheckMyStyle.

I've included the approximate time to completion as the "Duration" for each project.

Project URL: advan.io

Type: Portfolio

Duration: ~30 hours

JS, Jade, Photoshop

Brief:
Advan.io is the spiritual successor to Advan3d my original 3D modeling portfolio.
About Me

I most recently graduated from Galvanize, an intensive 6 month development boot camp. I'm quite familiar with boot camps, as I'm also a traditional Air Force Reservist specializing in signals intelligence.

Before all of this however I maintained a nine year career as a professional computer animator creating engineering-based animation and graphic design for litigation for the likes of Ford, and Waste Management to name a few.

I am also an armchair industrial designer; I create things: pragmatic, creative, real, and virtual.

This mixture of backgrounds and interests has given me an eclectic collection of projects, however there is a common thread among them: I turn ideas into products, whether they are 3D visualizations, software applications, or physical.

Random Cool stuff I've done:

Built my own "great" sword! Curious?

Created several original garments to include full length coats and jackets.

Taken multiple ideas from concept to design to physical prototype.

Created physical items through rapid prototyping.

CheckMyStyle

_

YouTube Video Demo: https://youtu.be/Y4uoSMYITeI

Project URL: checkmystyle.advan.io

Download Plugin: CheckMy.Style on Chrome Webstore

Type: Capstone

Duration: ~600 hours

JS, AngularJS, Mongo, Jade + Gulp, Chrome, CSS, JQuery, Facebook Graph

_

Brief:
CheckMy.Style is a unique Chrome Extension and website to allow users to quickly and easily create outfits while shopping for clothing online.

_

Synopsis:

Initially I planned to only build the Chrome Extension, as a result I included all of a "main site" functionality within the plugin. Late game user testing (i.e. people were like "this is too hard to use") revealed that my UX left much to be desired. As much as I loved what I had done, if people were to actually use this thing it would require a rebuild, of sorts.
After the rebuild I was able to rapidly develop contingent UX improvements such as in-line form inputs in the custom dropdowns as well as utilizing automatic article type identification to make adding articles a two-click process. I accepted the shortcomings of the original interface and actively sought user input to help turn the interface into it's current state.
I used this experience to really understand the core use case of this plugin and I will continue to develop it with that use-case in mind.

_

Future:

This application may have practical merit. I will continue to develop it as well as streamline the UX. Future features include live updating FashionStream, outfit "likes" through Facebook Graph, Facebook,Twitter,Twillio post/messaging to allow quick dissemination of newly minted outfits.

_

Road map includes:

    Update main interface:
  • Socket.io connection for intermittent (~3-4s) polling to update FashionStream as users are bookmarking fashion
  • Reduce clutter, increase white-space.
  • Determine user interaction level.
  • Network with Fashion Bloggers.
  • Develop Fashion Stream
    • What's trending
    • Filter methods
  • Develop administration panel
    • Removing inappropriate articles
    • Banning/user misuse scenarios
    • Article flagging system
    • Create and maintain whitelist/blacklist for websites
  • UIX improvements galore...
    Monetization Strategies:
  • Stage 1: Affiliate network links on "Buy Now" buttons
  • Stage 2: Banner Ads
    • Display targeted ads in plugin based on user search
    • Display single sponsored ad on main site rotated on monthly or bi-weekly basis
  • Stage 3: Order Aggregation "One Click Outfit Buying"
    • Single Sign in with CheckMyStyle
    • Develop or utilize existing e-commerce solution to allow fulfillment from participating vendors
  • Stage 4: ???
  • Stage 5: Profit!
WordExplorer

_

Browser Compatability Note: Word Explorer appears to work best with Chrome

Project URL: wordex.advan.io

Type: First Project

Duration: ~180 hours

APIs, d3.js, JS, Mongo, Jade, JQuery

Brief:
Word Explorer is a fun way to explore a thesaurus to learn new vocabulary. It employs an advanced d3.js Chord-Graph to show relationships between a root word, it's part of speech, and it's related words either synonyms or antonyms.

_

Synopsis:

This project was the first major project undertaken at approximately 7 weeks into the course. Features of note include the use of the d3.js Chord-graph, word list generation and subsequent key-event based word list filtering.
The word suggestion box employs Twitter Type-Ahead to help the user find the right word from a 60k point dictionary API calls are made to multiple sources to gather the most options for definitions and related words.
typographer

_

Project URL: typo.advan.io

Type: Mid-term

Duration: ~100 hours

JS, Mongo, Jade, JQuery

Brief:
Basic C.R.U.D. app backed up by novel features such as "likes" and asynchronous user commenting system.

_

Synopsis:

The most notable features of this project are the use of AJAX calls to make async writes to the database without having page refreshes or otherwise interrupting the user experience - yet still have nearly realtime database updates.
The like button, as well as the user comment system employ these techniques. The comment system has the additional feature that once a comment is submitted, it is shown immediately, however does not become editable until the AJAX call completes.
I experimented with more CSS techniques in working on this project. This is also a good frame of reference to see progress at approximately 10 weeks in to the course! The impetus behind this project was the need to design a functional application in a relatively short period of time.
Resume
Resume (Creddle.io)
Download (.pdf)
MS SQL 2008R2
Postgres
Mongo
Atom
Chrome
CSS 3
HTML 5
Gulp
Jade
JavaScript
AngularJS
Node.Js
NPM