Hello, I'm Tai. I am a creative who loves minimalist, user-centered design, a front-end developer who finds wrangling code oddly satisfying, and a business-minded problem solver who gets the big picture. I love working with interesting people on innovative ideas at the intersection of business, technology, and design. Curious about more?
Biddenly Real Estate
Front-end development (web & mobile)
Biddenly, an apartment rental start-up in San Francisco, fired an important first volley last year by re-imagining the ubiquitous Craigslist housing posting. I worked with one of the founders to help launch the real estate division. It was my responsibility to envision what a for-sale listing might look like by applying the same fundamental principles of clean, informative design and to develop a minimum viable prototype to gather feedback with realtors and customers.
Anyone who has ever shopped for a home with a realtor has suffered through the barely comprehensible data dump that is the MLS listing. Our goal for the design was to dramatically improve the user experience by presenting a clearly structured interface that captures what the ideal home sales listing might look like. Despite the density of information that home listings entail, the design should still feel clean and minimal, with the most important facts presented first.
Design for Mobile First
We expected that as many people would use this tool on their phones while touring a home as those who would be researching them on their laptops at home. With a mobile-first approach in mind, the full-sized version is responsive down to 640 pixels wide, and on mobile devices a version optimized for smaller multi-touch screens takes over without compromising the design.
Present the Right Information at the Right Time
The landing screen should quickly allow users to decide whether to explore further or move on -- Can I afford it? Is it big enough for my family? What does it look like, inside and out? Less important details are collapsed in the default view to draw emphasis to the ones that are more likely relevant -- e.g. information about the basement is usually more important than the attic, the parking structure and number of spaces matters more than the driveway material.
Provide Multiple Entry Points
Calls to action on the initial view invite the user to explore more pictures or get in touch with the seller. Nearly every element in this view is clickable and reveals additional detail by linking to another section of the page. Under Home Details, School and WalkScore information serve as entry points to more information. Floorplans within each room allow easy navigation to other parts of the tour.
Simulate the Real World Experience
We wanted the presentation to capture the experience of physically touring a home. Features and selling points can be described on a room-by-room level, and we envisioned a way for sellers to add a rough floorplan by creating draggable shapes for any rooms that have dimensional information. The design emphasizes relative size and location without burdening users with excessive detail.
Unanimo.us (working title)
Concept development & prototyping
Most social networking platforms are designed to help existing friends connect. Considerable thought goes into presenting and filtering content to maintain a profile appropriate for an audience made up of friends, family, and coworkers, often obscuring our genuine selves. The concept of Unanimo.us hinges on the theory that engaging people with insightful questions, rather than the image they choose to present, tells a better story about who they really are. In doing so, it aims to create new type of social network that helps like-minded strangers connect.
Meeting new friends can be challenging during our adult lives. Compared to our formative years, we meet fewer new people on a regular basis, and the likelihood of becoming close with these people is even further reduced as a result of disparities in age, lifestyle, and background. As social circles shrink due to relocation, marriage, and other life changes, the prospect of making close friends often diminish dramatically. How can technology solve this problem?
The crux of this project is to provide a new way to answer the question “I wonder who else is like me?” At its core, it aims to create an engaging platform that utilizes anonymity to encourage honest responses to user-submitted questions. In a way, the site will become an organically evolving “personality test” with content that is upvoted and moderated by the community. Users will be anonymous with no names or photos, and their profile will show the questions they've answered and where they fall along various personality metrics. An initial set of basic functionality will allow users to find and contact like-minded people in their area.
The process started from a few simple sketches on paper that were then transferred to wireframes in Fireworks. They were initially stitched together to create a simple interactive flow using Invision. While this proved to be a great start without much upfront cost, the limitations of the software resulted in a great deal of redundant effort when it became necessary to make changes or show diverging flows. Rather than continuing to refine static mockups, it made more sense to move directly to building an HTML prototype early in the process using CSS3 flexbox to rapidly lay out content. Browser support is currently limited as a result, but the intent so far is to have designs that can be shown in a controlled environment.
tai zhang | photography
Photography portfolio refresh
Originally developed in Flash a few years ago, my personal photography portfolio served as a good candidate for an update using HTML5, CSS3, and jQuery. I recreated all of the animations and interactions of the Flash version while making a few improvements to the code to make it easier to add new galleries. A more extensive update down the road will involve redesigning the layout to be responsive and mobile-friendly and utilizing pure-CSS transitions on modern browsers.
Min & Tai
Web & print design
My wedding provided a unique DIY opportunity for some more casual creative work, so I created both the website and day-of print materials including the program, menus, and seating lists. The photo gallery is the most recent part of the website and uses Brandon Aaron's jQuery Mousewheel plugin to create a one page horizontal slideshow. I recently updated the CSS to be fully responsive across all resolutions.
McMaster-Carr Supply Company
I was part of a highly selective rotational management program at one of the leading suppliers in the $100 billion/year Maintenance, Repair, and Operations (MRO) industry. This program is designed to develop executive leadership skills through exposure to a wide range of operational competencies and business areas. During my time here, I've worked in leadership roles within Information Technology, Merchandising & Publishing, Supply Chain & Logistics, and Finance.
Finance Manager - Accounts Receivable and Credit Risk
2012 - 2014
Led the West Coast region’s accounts receivable department of 2 junior managers and 23 account specialists to establish strategies that reduce aging debt and limit financial loss.
Achieved a reduction of 25% in bad debt loss between 2012 and 2013 by improving targeted reviews of risky customers.
Warehouse & Logistics Manager - Parcel Packing
Oversaw a department of 15 employees who assemble and pack over 10,000 daily shipments.
Eliminated wasted space by an average of 60% per box and lowered annual packing material costs by $150K after analyzing pack volume data to identify opportunities to add intermediate box sizes.
Product Manager - Customer Correspondence
2011 - 2012
Improved customer communication and simplified their internal workflows by redesigning McMaster-Carr’s system-generated documents for order confirmations and quotations.
Led the development of a new document generation system to be used for all automated documents, saving $1MM between labor and postage costs.
Advised executives and project teams across the department on information design strategies.
2007 - 2011
Managed the creative department of 20 print and web content creators, photographers, and retouch artists.
Provided information design direction and strategy for Product Line Managers to create presentations that clearly illustrate the features and benefits of complex industrial products.
Oversaw the digital and physical production of the company’s 3,800 page catalog and graphic assets, ensuring high quality work while adhering to weekly production deadlines.
Product Manager - Web Development
2006 - 2007
Conducted competitive research, formulated technical and business requirements, developed interaction flows, and redesigned the user interface to improve how customers interact with their order history information online.
Worked with customers in the field to understand use cases and conduct A/B interface testing.
Improved the user experience throughout the company’s e-commerce site by leading a team of engineers to develop a responsive and dynamic new web application framework.
2005 - 2006
Designed UI changes, implemented technical solutions, and analyzed behavioral metrics to improve various ordering, security, and account management features of McMaster.com.
For the sake of continuity, much of my previous work can be found on my now rather ancient and outmoded Flash portfolio (circa late 2004, yikes). It was my first Flash project and, I'll admit, created with far more emphasis on flair than usability. Needless to say, it now represents quite a departure from modern norms. Fortunately, both technology as well as my design sensibilities have evolved significantly since then.
Bachelor of Arts, College of Arts & Sciences
2001 - 2005
Information Science, concentration in Human-Centered Systems
Cornell's Information Science major combines interdisciplinary coursework from the fields of Computer Science, Psychology & Cognitive Science, Communications, and Sociology to examine human-computer interaction, the effect of technology on the lives of individuals and social groups, and how people can use technology to shape new developments.