Shammel Lee

Product Designer
Software Engineer

 

Selected Work

Web: Concept Tool Rental Site - Visual Design Web: Concept Tool Rental Site - Maps Web: Concept Tool Rental Site - Scenarios Web: Concept Tool Rental Site - Landing Page Wireframe

ToolSummit

A concept website for a tool rental site that lets users find power tools they can rent from others. The requirement was to add features that would be important and make the transaction process as smooth as possible.

Role

  • Product Design

Software

  • OmniGraffle
  • Sketch

Web: Movie Rating App Prototype

CineGram

A prototype for a movie rating app. The bar chart pulls data from an API every minute and updates the table below as well.

Role

  • Product Design
  • Development

Software

  • OmniGraffle
  • Illustrator
  • Sketch
  • Framer
  • CoffeeScript
  • Apache
  • PHP
  • Perl
  • MongoDB
  • jQuery
  • D3.js
  • GSAP

Mobile: App Prototype

Lotus

A prototype for a fashion trend app. Here, I focused on creating a simple and intuitive experience with a minimal UI.

Role

  • Product Design

Software

  • OmniGraffle
  • Sketch
  • Illustrator

Mobile: B&D Kiosk

B&D Kiosk Front-end

The front-end of the Bow & Drape Customization Kiosk. Customers used this web app on an iPad to place orders. Since customers weren't tech-savvy, they preferred to customize their orders in person rather than customize from within the app. I added the ability for customers to take photos of their designs with the iPad from within the app. As a result, orders were created more accurately and there were fewer returns. This allowed Bow & Drape to increase profits during the holiday season.

A few of the major challenges were reducing the photo's file size and correcting the photo's orientation. The size of the raw photos were so large, they would cause transactions to stall. I reduced the file size dramatically by lowering the image quality as well as scaling the image down. This led to transations being sent instantly.

Role

  • Product Design
  • Development

Software

  • OmniGraffle
  • Illustrator
  • Sketch
  • Framer
  • CoffeeScript
  • Pug
  • Stylus
  • Backbone.js
  • Marionette.js
  • jQuery
  • Lodash
  • Handlebars.js
  • Firebase

Web: B&D Kiosk Back-end

B&D Kiosk Back-end

The back-end of the Bow & Drape Customization Kiosk. Employees used this system to monitor and process incoming orders in real-time. This allowed orders to be placed and received within an hour, which was crucial during the holiday season. Several microservices were built to handle things like email notifications, logging, and Slack bots.

Role

  • Product Design
  • Development

Software

  • OmniGraffle
  • Illustrator
  • Sketch
  • Framer
  • CoffeeScript
  • Pug
  • Stylus
  • Backbone.js
  • Marionette.js
  • jQuery
  • Lodash
  • Handlebars.js
  • Moment.js
  • Firebase
  • Twilio
  • NGINX
  • PHP
  • AWS EC2/S3/CloudFront
  • Ansible

Cloud File Manager App

Role

  • Product Design
  • Development

Software

  • CoffeeScript
  • Pug
  • Stylus
  • Backbone.js
  • jQuery
  • Underscore.js
  • Handlebars.js
  • Apache
  • PHP
  • MySQL
  • AWS S3

Onboarding Site

Role

  • Product Design
  • Development
  • Motion Design

Software

  • Illustrator
  • After Effects
  • Logic Pro

Web App: Financial Recruiting App

Financial Recruiting Platform

Role

  • Product Design
  • Development

Software

  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • Backbone.js
  • jQuery
  • Underscore.js
  • D3.js
  • Apache
  • PHP
  • MySQL

Web: Real Estate App Prototype

Real Estate App Prototype

Role

  • Product Design
  • Development

Software

  • Illustrator

Shelley Goldberg Site

Role

  • Development
  • CMS Development

Software

  • ActionScript
  • PHP
  • MySQL

Web: theTEN Site

theTEN Site

Role

  • Retouching
  • Design
  • Development

Software

  • Photoshop
  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • jQuery

Web: Levinson Tractenberg Site

Levinson Tractenberg Site

Role

  • Development

Software

  • CoffeeScript
  • Pug
  • Stylus
  • jQuery
  • GSAP.js
  • PHP
  • MySQL

Web: Keggy Site

Keggy Site

Role

  • Retouching
  • Design
  • Development

Software

  • Photoshop
  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • jQuery
  • PHP
  • MySQL

Web: Helen Wang Site

Helen Wang Site

Role

  • Retouching
  • Design
  • Development

Software

  • Photoshop
  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • jQuery
  • GSAP.js

Web: Peter Han Site

Peter Han Site

Role

  • Design
  • Development

Software

  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • jQuery
  • GSAP.js

Web: Grand Large Site

Grand Large Site

Role

  • Design
  • Development
  • CMS Development

Software

  • Illustrator
  • CoffeeScript
  • Pug
  • Stylus
  • jQuery
  • PHP
  • MySQL
 

About

Engineering is linked with “left brain” thinking and design, with “right brain” thinking. However, the best solution to any problem comes from combining both forms of thinking. A designer who is adept in engineering can create more thorough, feasible solutions for that product. Similarly, an engineer with a design background will be able to create a more intuitive and appealing product.

Having a deep understanding of both form and function and being able to speak the language of both the designer and the engineer allows products to be implemented exactly as they were envisioned, thereby eliminating the communication barrier that typically exists when building products. This prevents information from being misinterpreted and results in clear, consistent products that delight users.

 

Info