About

Aloha, I’m Brenda. I’m a product designer and web developer with a passion for designing fluid web and mobile interfaces that bring together functional and engaging user experiences. I take a user centered approach to build great visual and product design.

I have always been intrigued by great design. Whether it is a solid piece of furniture, a nice pair of sunglasses or a well-structured layout, great design has always caught my eye. The beauty, functionality and creativity that go into design are elements that inspire me to craft digital experiences. I enjoy writing clean, organized and semantic code while experimenting with typography, subtle animations and CSS tricks. I love what I do and I’m always striving to improve my design skills.

I’m currently a product designer at Centerfield, a marketing and advertising technology firm. There are many projects in the works, but some of the key projects I lead the design and implementation include an Agent Console, Workforce Management platform and IVR Script Studio application.

Fun facts about me: I'm a certified open water diver, lover of puppies, and lover of all things matcha. I was also a pharmacy technician in another life.

Connect with me at hello@brendalau.com

Jquery Tutorial

  • Visual Design
  • HTML
  • CSS
  • Javascript / jQuery

The goal of this project was to create a site to showcase the use of javascript / jQuery in three tutorials. The tutorials are focused on an imagery theme with step-by-step instructions to incorporate jQuery image effects on any site. The project is designed to be clean, concise and easy for users to follow through each tutorial.

Since this is an earlier project, responsive design is not implemented. Project is best viewed on browsers with screen sizes 1100px and up.

View Live

The first tutorial showcases an image slider, the second one an image zoom effect. Both tutorials are to be used in conjunction with embedded code snippets and a plugin. Documentation is provided for the plugins to allow for easy implementation. Finally, the last tutorial is also an image slider which shows line by line the written script required to function. The site also includes a sticky navbar to allow easy navigation between tutorials.

Since the step-by-step documentation is text heavy, I used accordion tabs to hide/show information as required.

#FFEFD5

#ADD8E6

#A9A9A9

I incorporated three light and warm colors to bring out a tropical theme for the site.

jquery tutorial screenshot
jquery tutorial screenshot
Top