Professional Ethos:
UX can be a limiting concept. Although usually user driven, digital experiences can transcend a user experience, especially outside the context of a website or an app. Participant Experience, though more vague semantically, includes those passively engaged. In a world of UX driven design, users are the driver, and that's all that needs to be designed in single user apps. With a more open-ended experience design approach, the screen is no longer a limitation. From apps that remotely control home automation to custom built interactive environments in marketing campaigns, the user is the driver, but that concept can be blurred, and the participant can be the user, the driver, or a bystander and still be engaged. In a physical interactive space, engagement isn't necessarily user-centric, and UI doesn't have to be either. Similar to UX design, the holy grail standard is the intended behavior of the user so it's goals are parallel, however Participant Experience is also responsible for a grander spectacle and the interactions beyond the immediate.
Designer's Statement:
My passion is design, my tool is code. I have a split career as a UX developer and a SVG & 2D web graphics animator. I've taught graduate level interaction design at Pratt and have experience with OpenFrameworks with just enough C++ knowledge to build an app with the code libraries available. Currently I'm learning Cinder and have found it to be essentially the same as OpenFrameworks, but better documentation and platform support.
Who is Eric?
I grew up in Kansas City and I began studying Animation in college in 1999. The 19 year old me was daunted by the looming fears that the software we were learning would become obsolete, so I added Sculpture as a second major. I suppose I loved using rudementry technology like motors and lights so naturally I found myself looking to newer technologies again. Toward the end of my undergradute I decided it was entirely possible to continue down a path investigating ever changing technologies as tool and method to investigate art and design. I considered two Art & Technology Master's Degree programs and decided upon Cranbrook 2D Design. Here I wildly investgated everything in all compacities of design and learned from and taught my peers. Here I also began woking with hardware, learning AS2 and javascript, but it wasn't until after I moved to New York in 2007 before I jumped head first into coding. 2008-2009 learned Flash AS3 with Greensock, javascript and jQuery -- meanwhile picking up After Effects freelace projects. I built my website 3 or 4 times between 2008-2011, built numerous small client sites (many are no longer live), and soon landed teaching gigs and long term ongoing contract jobs. Since March of 2011 I have been working as a front-end developer concentrating on presentation, style and animation.
-
Work Experience
-
Creative Technologist
Hogarth Worldwide @ Wall Street Journal
December 2019 – Present
New York, NY
• Building an email template and component system with a Ruby/node/SASS/handlebars build
• Assisting design team by establishing an enforceable style system for template workflow
• Multifaceted role spanning tasks from front-end dev, animation, design and emerging tech
read more -
Media Lab Fellow
The Economist
July 2019 – Sept 2019
New York, NY
• 10-week Fellowship with the Business Development & Innovation team
• Focus on augmented reality in journalism contexts
• Ideating, building AR prototypes and presenting moonshot design initiatives
read more -
UX Engineer
dv01
Jan 2019 – May 2019
New York, NY
• Building and maintaining a style guide as React.js components in Storybook
• Hybrid prototype engineer, UX role at a fintech startup for SaaS app
read more -
Freelance Developer / Animator
Fake Love
Sept 2018 – Oct 2018
Brooklyn, NY
Helped build a multi-screen, tablet driven interactive experience for a permanent installation.
• Built a dynamic system of charts from API data
• Highcharts.js is the primary data parsing tool with significant GSAP manipulation
read more -
Front End Developer / Animator
J.P. Morgan Chase & Co.
Consumer BankingFull Time Employee
Jan 2016 – July 2018
New York, NY
• Recruited internally as an initial member of a new internal design agency at JPMC, Core Digital
• built the prototype for the JPMorgan.com 2018 redesign
• built prototypes / dev work for many Chase, J.P. Morgan and JPMC lines of business
• built several high profile site such as Jamie Dimon's Annual Report website
• animated infographics
read more -
UX Developer / Animator
J.P. Morgan
Corporate Investment Bank20h/week contractor
May 2011 – Dec 2015
New York, NY
• Helped build and maintain the JPMorgan.com 2012 and 2015 sites
• Build modules and reusable front-end components for Fatwire deployment
• Built and animated small interactives, infographics, SVG graphics
• Built a data visualization component in the CMS with Highcharts.js for JPM.com
• Interactive components showcasing small collections of the firm's art, media or history archives
• Contributed to brand templates and internal demo site
• Animated many (online) holiday cards for the firm. These were animated with Raphael.js so I could animate SVG vector graphics across all browsers. Yes, IE6, and this was a requirement
• I built banner ads in Flash / HTML and used Sizmek to deploy them
• After Effects when needed
read more -
HTML5 & Javascript Animator
Macys.com
20h/week contractor
Mar 2011 – Dec 2015
New York, NY
• HTML5 banner ad animations using SVG, canvas and lots of GSAP
• Rich media units with varying levels of interactivity and server side data
• DoubleClick
• QA and perfectionism
I took many of the challenging projects, like the Thanksgiving Day Parade ads with 1000 balloons, 4th of July Fireworks ads with perfectly tweaked particle emitters, or the Versace ads where the client provided one flat image and we had to make an etherial luxury animation out of it. Originally this was a Flash animation role but our team moved to HTML in 2013. When we moved to HTML I stepped up to build the branded templates using SVG — this included training the design team how to prepare SVG assets and training the dev team how to animate them.
read more -
Visiting Professor
Pratt Institute
Jan 2011 – Dec 2015
14th St. campus, NY, NY
I taught courses in interaction design in the Graduate Communications Design Dept. Primarily my students were very green with code, but between their existing skills with inVision prototypes and my code examples, often students found they loved the code. Several of my students work at fantastic design firms in the city specializing in hybrid design/development roles. Other students concentrated on UX strategy (less development), and other students experimented with OpenFrameworks. Responsibilities included several rounds of critiques during the semester and departmental critiques at the end of semester.
I also taught one semester of Motion Graphics in the undergraduate COMD on the Brooklyn Campus in Spring 2011.
http://courses.ericbintner.com/read more -
Visiting Instructor
Missouri State University
Fall 2010
Springfield, MO
In the Fall of 2010 I left NYC to teach at my Alma mater for one semester totalling 5 sections of undergraduate courses.
3 sections: Animation 1, This is the first course offered for Animation majors. This course taught animation fundementals using After Effects. This might be my favorite class I've ever taught because the students were all entering the first class for their chosen major so they were excited to learn and were fully invested.
2 Sections: Intro to Digital Media Arts, this was an open ended intro course for interactive and digital media. Primariy I introduced students to the worlds of interaction design, web animation with small projects that were acheivable by beginners. For instance I introduced OpenFrameworks very early in the semester to show the possibilities and the grander vision of interaction design beyond the web, but the primary goal for the course was to introduce them to the tools and the concepts and not necessarily to get them to try to learn entire development languages.
http://courses.ericbintner.com/read more -
Jr Front-End Developer / Animator
CS Designworks
May 2009 - Aug 2010
New York, NY
CS Designworks is a small design studio in Midtown with primarily corporate and real estate clients. I helped build pages in an existing framework for Cushman & Wakefield's marketing website, built microsites for other clients, firms and corporate office buildings, and the ocassional After Effects animation for an event. At CSD I built a flash banner ad for One World Trade Center just as the building was being completed. I left my role here to accept a temporary teaching position at Missouri State University.
read more -
Education
-
Cranbrook Academy of Art
M.F.A. | 2D Design
2005 – 2007
Bloomfield Hills, MI
-
Missouri State University
B.F.A. | Animation / Sculpture
1999 – 2005
Springfield, MO
-
Awards & Achievements
-
Biannual Faculty Art Exhibition
MSU Art & Design Exhibition Center
2010
Springfield, MO
Another kinetic sculpture Landscape Machine was included in the MSU Faculty Art Exhibition. The piece was mounted to the ceiling in two parts, one side that mounted a fixed height cable, and another side 12ft away that moved a cable mount up and down, allowing a wheel with a video projector to freely roll left or right. I used OpenFrameworks and a video camera to then capture the movements of this free-rolling projector so I could play video based on the projector's left/right proximity. The video is of a traditional outdoor landscape (with a a few digital augmentations) and the OF software simpily slid the video left and right to make the video to appear to shine a hole through the wall.
read more -
MSU Centennial Art Exhibition
Springfield Art Museum
2005
Springfield, MO
My kinetic sculpture The Relationship Between Free-Wheeled and Determined Actions was chosen to be included in the MSU Centennial Art Exhibition Art Exhibition for Missouri State University. The piece hung in the center of a room with 20ft ceilings and it spins a bicycle wheel at a constant pace causing an attached bowling ball to drop and shake the machine, which in-turn caused a loosly attached wheel at the far end to flip, or spin somewhat irregularly and unpredictably.
read more -
Ranked top 30 in the 1650 Freestyle
NCAA Division I Men's Swimming
2002, 2003
Springfield, MO
-
Eagle Scout
Boy Scouts of America
1997
Lee's Summit, MO
-
-
- Node.js
- Gulp
- SCSS
- Handlebars
- NPM
- GIT
- Custom nav architecture built in 3D CSS coordinates
- User initiated animations are GSAP or pure CSS
- ERICBINTNER.COM subtractive color logo built in canvas with js
- three.js WebGL (desktop site) modified from these sources
WebGL Clouds on Experiments from Google
WebGL Aurora forked from this broken CodePen - This site contains many features that push the boundaries of browser graphics – some browser rendering differences are likely to occur.
- Likewise, I do not have *all the devices and browsers* and the QA process includes *only my hardware*, therefore (as of this writing) expect bugs in Android and Windows.
- This site lightly uses jQuery as I needed a site built ASAP (I built this in just over 2 months). I realize how and where many aspects of constructing the DOM in my usage can leverage a virtual DOM such as in React.js, especially for larger, more scalable projects than this.
This Website:
https://github.com/EricBintner/portfolio-siteBuild:
Front-end:
People I want to thank:
Vonda Yarberry: Missouri State, Animation Professor Elliot Earls: Cranbrook, 2D Design Artist In Residence Andrew Prinz: Artist/Musician, Mahogany (band) Cheryl Molnar: Painter, J.P. Morgan Graphic Designer Santiago Piedrafita: Pratt, Grad COMD Chairperson
Influnces:
Brain Eno Golan Levin Cyrak Mike Bostock Pipilotti Rist Michel Gondry Guy Debord That challenging Radiohead website released at the same time as Kid A.