eshiota.com

Eduardo Shiota Yasuda is a front-end engineer, designer, and occasionaly writer and speaker. He handcrafts clean, readable, scalable code and interfaces; believes that Math and Design are everywhere.

Portfolio

Here are the most notable and recent projects I've worked on, my personal experiments, and my presentations.

Professional

Recent and notable public projects I've worked on.

Baby.com.br screenshot

Baby.com.br

Brazil's 2013 "Best New Online Store" by E-bit. Launched in February 2013, it features a clean look, semantic HTML5 markup, scalable and tested JavaScript with an in-house architecture using Jasmine and jQuery, and lean CSS.

Cover screenshot

php|architect, May 2012

Featured article on php|architect May 2012 issue: "Developing Websites for Users, Not Machines", showing that code is more than tests, standards and good practice. Code is also part of the User Experience.

Website screenshot

Agência Ginga Website

The Agência Ginga's website uses Ruby on Rails, Backbone, CSS3 animations, and Responsive Web Design concepts to provide an engaging experience. It won the Mobile Site of the Day from FWA on April 2012.

After I left the project, some modifications were made and the transition around the 790px breakpoint is now broken. =(

Abril Infotrends 2011 Webapp

Webapp with the conference's schedule, information, and list of speakers. Uses jQuery Mobile, appcache, HiDPI images, loads the data from a remote XML, and implements the relationship between speakers and presentations.

View demo video

Personal projects

Personal part-time projects and experiments.

Project screen

eshiota.com

This blog! It uses Middleman and Compass, and has a golden-ratio-based, responsive design. Feel free to study its implementation.

Project screen

JS Minesweeper

HTML/CSS/JavaScript implementation of the Minesweeper game. Features an organized code, with separate modules for each concern.

Middleman Sushiplate

A boilerplate theme for Middleman projects. It features a base layout, a SASS structure for modular components, jQuery, Picturefill tag helpers, and deployment configs to Amazon AWS S3.

Project screen

Front-end Patterns

Collection of some front-end tricks that I presented on a Devcast episode. It still needs some love and more additions. =/

Presentations

Presentations and workshops I've presented on companies and events

Presentation's first screen

Modular and Event-driven JavaScript

Presented on SampaJS 2013. Large applications must have a well-structured JavaScript in order to be maintainable and easily adapted. In this presentation, I showed how a modular and event-driven approach provides scalable, adaptable, independent and testable components.

Presentation's first screen

Analyzing, Adapting, and Improving an E-commerce’s Information Architecture

Presented on Congresso E-Commerce Brasil 2013. In this talk, I showed how Baby.com.br implements the Information Architecture discipline in the development process.

Presentation's first screen

The Front-end Development Challenges on an E-commerce Platform

Presented on OlhóSEO Florianópolis 2013, Front in Rio 2013, and Web Day 2013. In this talk, I shared the experience of being a front-end engineer on an e-commerce with millions of monthly visitors: how we work with large teams, sharing the knowledge, maintaining a standard, while developing modular and scalable components.

Presentation's first screen

Front-end Architecture on Large Scale Applications

Presented on TDC 2012, Tableless Conf 2012, and RubyConf Brazil 2012. In this presentation, I show the concepts behind a modular, scalable front-end architecture on the HTML, CSS, and JavaScript.

Presentation's first screen

Responsive Web Design and the Web Ubiquity

Presented on QCon 2012 and Dev in Sampa 2012. In this talk, I show why Responsive Web Design is the next step towards web ubiquity, and what are the technical requirements to make it happen.

Presentation's first screen

User Experience for Developers

Presented on Dev in Sampa 2011 and Dev in Vale 2011. In this talk, I show tips and strategies for developers so that we stop coding for machines, and start coding for humans. Tagline: "The user is NOT stupid. You are the one who's too cocky. #thereISaidIt".

Presentation's first screen

Sushi and Interfaces

Presented on PechaKucha Night São Paulo, following the 20x20 format (20 slides with 20 seconds, automatically progresses). In this presentation, I compared my work (Design and UI development) with the work of an Itamae (japanese chef).

Presentation's first screen

Design and Interface inside the Development World

Presentation about how to integrate Design, Information Architecture, and UI development with the back-end development, through agile methodologies.

Presented on Dev in Sampa 2010, and companies having trouble with distributed and agile teams.