I design and code, and I specialize in enterprise app UX / UI

These are my specialties

Front End
“Front Front End” is a term I made this up at work to explain my skill set - HTML CSS but very little JS. Don't worry, I work closely with devs and super comfortable finding my way around js / react code, even ruby on rails, elixir, meteor, and a few more I've encountered in my career.

These are the services I provide

I also offered these services in the past - meet with clients, assist with onboarding new hires, mentor interns, plan office layouts, find the best deals, build Ikea furnitures, calculate efficient number of pizza slices to employee ratio.

Hello from Vancouver, Canada. Here are some of my notable projects.

These are enterprise applications or proprietary projects I am not able to show any full detailed design, but I hope it gives you an idea on the process and work involved for each, and then let's have coffee / bubble tea / pizza tuesday to talk more in details.

Aquila Redesign

UX UI Wireframe Design CSS

Aquila is a custom web application for ship construction where it manages tasks and to-dos for shipowner, shipyard, and other parties, as well as tracks communication amongst them.

A few new potential clients triggered an initiative for a "new design", and so there was an opportunity to rethink many things - improve existing workflows, update the visual, and tacke some long standing design debt.

This was more like trying to "persuade" the management to invest in design. I've put together several design documents including an updated UI across the app, and a plan on how to implement it in phases, improvement on existing components, and push for consistency within the app. As well as new concepts that may help push the app towards becoming more of a product. I even managed to push for a React upgrade for the dev team.

FPS Schedule Module

UX UI Front End Wireframe Design CSS

Fleet Performance System is a custom web application that tracks many data points while a ship travels from A to B, such as position data, fuel efficiency, schedule and crew, for an entire fleet of ships. One of the key modules in the app was the Schedule, which was updated every week to show where all the ships are going and their estimated date of arrival.

The previous design was simple and provided a calendar view across the entire fleet; since it was used quite heavily, the client were looking for ways to get more out of the system.

I worked with the client to figure out how exactly users were using this page - what they are looking for and how can we help them find it faster, as well as relevant information that may come in handy when an user needs to know when a ship is going to be where on what date. We were able to put together an updated design with several improved features such as able to edit a watch list on the spot, show potentially how busy a port would be on a specific date, provide additional details to specific vessel.

Agency App DA Module

UX UI Wireframe Design

A web app for capturing cost and expenses for ship owners and agents when a ship arrives to port,disbursement account module allows agent to view list of DAs and its statuses, create a Proforma DA when an appointment is accepted.

This was an advanced system where user needed to going through many steps and filled in many forms for their work; at the same time some of these users only logged in once every few weeks; speed and ease of use were the most important factors. The existing system was outdated and had a lot of manual entry that could be improved and save users time.

I spent a week with the client to gain an understanding how the business and the DA work. Everyday I would present what was done, and ran through any ideas and questions about the design. We continued the work remotely and coordinate through Basecamp and Jira, and handed off a design package for the main workflow.

My-A3 Website

UI Front End Design CSS

Build website for A3; A3 is a web application from Callisto Systems to help port agents do their work.

The client had started on a new design for the website but was unfinished. They also needed some changes for the proposed new design.

Sometimes small changes and tweaks can go a long way. I provided a new revision with changes that matches closer to the client's branding / style, along with their feedback. Not everything needs a redesign, I was able to keep the overall feel the same, and just adjusted certain layouts and elements in the content.


2011 — Present

Stage 3 Systems Inc.

  • Design Director
  • In charge of all UI/UX needs within the company, from application design to branding and marketing materials
  • Meet with clients from major shipping companies such as Seaspan, Glencore, and DA Desk, and help solve unique industry problems such as thousands of emails in a day, complicated document process, and long form entries
  • Introduce design components such as timeline, autocomplete, and activity log, into the legacy enterprise apps, and help users adapt and improve their work efficiency

Reinvent Inc.

  • Designer / Front End Dev
  • Work closely with the lead designer and developers for all projects and all mediums; landing / sign up pages for social media site that helped increase sign ups; various artworks such as daily deal images, gift cards, brochures, and sandwich boards for advertisers for a group buying site

Vancity Buzz

  • Contract
  • Redesigned website for Vancity Buzz, a well known local blogger

Thirdi Inc.

  • Designer / Front End Dev
  • Put together marketing/business proposals, created wireframes, designed and implemented front end for client sites/apps such as Earls, JustTheBill, and Panacea Financial.

Navarik Corp.

  • UI Developer
  • Worked with a team of designers and developer building the front end, created HTML/PDF templates in conjunction with CSS, implemented javascript and PHP for modules used throughout Navarik applications


  • Education
  • Computing Science Degree graduate, with Software Engineering Specialist
  • Coop in Japan for 7 months


The Essentials

These are tools I use pretty much everyday, or my preferred choice when it's needed

  • Pens + Notebook + Stickies
  • Sketch + Abstract
  • Adobe XD / Invision
  • Adobe Illustrator + Indesign + Photoshop
  • Less / Sass
  • Bootstrap / Bulma
  • Squarespace

Bottom Drawer

These are items I use occasionally, used them for a specific project, or I use them but I don't actually know how it works in details (for example, I can git commit / rebase / fix conflicts for you in Terminal, but I won't be the one explaining how Git really works)

  • Git
  • Terminal
  • Wordpress + Divi
  • Prince XML
  • Zendesk

All of the ways to reach me