My Udacious Journey
“If a picture is worth 1000 words, a prototype is worth 1000 meetings.” — @ideo.
As a UX Designer, I was a maker at heart and took pride in bringing my designs to life through prototype. To be able to go into a room of stakeholders with a prototype in hand is worth a thousand person-hours of design and planning meetings. You start seeing possibilities and get closer to your actual product faster. I always felt prototyping in code was powerful and efficient compared to the other non-code based prototyping tools.
I decided to further up my coding skills for the following reasons:
Currently design education lags the technology industry’s needs for data-oriented, coding-enabled graduates with business acumen. — Design in Tech Report 2016
Proliferation of Design Systems: If you are a designer in a high-tech company you are most likely to work from a design system and style guides. Being proficient with front end workflow makes it easier to put together interactions, flows and Responsive Design leveraging reusable components.
Designing with Data: Gone are the days of lorem ipsum. We no longer have to wait for the developers to tell us if the designs works for egde cases. Putting real data with JSON files into the prototype help to see if it works as intended and deal with iterative changes in code.
In 2016 I decided to enroll in an online coding class. After much Googling, I found Udacity. I took a few classes and was impressed by their content and teaching style. When they announced the Senior Web Developer Nanodegree*, I jumped on it although it was way beyond my current coding skills. Project based courses are best way to learn, experiment and also able to demonstrate understanding with a working product.
Here’s a summary of the projects I worked on :
Project 1 — Event Planner
- Responsive UI with bootstrap.
- Touch friendly, accessible forms with high conversion features leveraging latest HTML5.
- Use of Google API for geo-location.
- User information saved to Firebase hosted backend.
- App delivery automated using Gulp.
Project 2 — Public Transportation App
- Responsive web application to view the BART schedule with departure and arrival times of trains.
- Use of public BART GTFS data, coupled with CSV parsing and templates with handlebars.
- Offline-first functionality, if a network connection does not exist using service workers.
- App build process using gulp.
Project 3 — Restaurant Reviewer
- Restaurant review application with a focus on accessibility.
- Restaurant information, filters, customer reviews and a review form.
- Use of accessible images, color selections and contrast, managing focus, appropriate semantic elements and ARIA roles where appropriate.
- Responsive UI with material design.
Project 4 — Corporate Dashboard
- Dashboard application using Angular MVC framework and Highcharts
- Near real time data updates from CSV and JSON data files.
- Responsive UI
- App build process using Gulp
Project 5 — Capstone Project — Progressive Web App
- Progressive Web App with Push notifications, Offline functionality and Installable home screen.
- Responsive UI
- App Delivery with Gulp
Wrap Up
Although there was a significant learning curve and it took me a year to complete this Nanodegree the journey was incredible and gave me a lot of coding confidence.
My advice to anyone learning is to follow these strategies.
- Minimum Viable Product (MVP) : Adopting the MVP approach by aligning with project rubrics and then iterating quickly based on reviewer feedback to get closer to completion.
2. Leverage Community: Make use of the community discussion forum, slack channel, and developer guides to jumpstart projects.
This process has been extremely rewarding and I am hoping to use this knowledge to collaborate better with developers, build concept applications and work on my side projects.
*P.S. As of December 2016 Senior Web Developer Nanodegree has been discontinued and no longer available.
