Alex Tebbs - UI Developer | TDECU
UI Engineer

Click on a letter of my name

About this design

I like to be flashy, but minimalism is important to me. This type of design is popular among photographers, artists, and fashion labels. The stark, unassuming nature of the design provides a blank canvas upon which content becomes the absolute focus.

Remember me? Skeuomorphic design dominated the late 2000's - early 2010's. Skeuomorphic is a funny word which essentially means design which attempts to mimic the physical world. Skeuomorphic design is dominated by gratuitous use of shading and lighting, and in more extreme cases, texture and graphics to make a digital product resemble it's physical counterpart.

When designers felt Skeuomorphic design was becoming too overbearing, there was a large shift in the design world towards stripping out excess shading, lighting, and other affordances associated with the previous trend. This left us with "Flat" design. To me, flat design means focusing on creating clean and usable interfaces without using visual flair as a crutch.

This is everything you should never do. Poor hierarchy, misuse of typefaces, dark UI patterns, no consideration for mobile devices, obnoxious color pairings, awful contrast, distracting elements. Please don't make me do this stuff.

Seriously, .

Liberal use of primary colors, larger type, and colored, illustrative, iconography are a few of the things that make this design feel whimsical or even a bit childish.

I hesitate to use primarily dark color schemes -- black-on-white text is easier to read. However, black is a powerful tool. A darker grey balance can evoke feelings of sleek, modern exclusivity and mystery. Dark schemes can be useful when creating a product or website meant to be a counterpart to an already existing property. I also think a darker UI is a better fit when working on websites that deal primarily with video/other media. This mimics our expectation that video/other media appears on a black background, as it does on our TV sets.

Serif typefaces are seldom used in web design, and for good reason. Sans-serif fonts are friendlier and have been proven to be easier to read on screens, especially at small sizes. However, when attempting to target certain markets or create a sense of luxury, a design using serifs can give the impression of a high-end restaurant menu. Furthermore, liberal white space, thin strokes, and reserved use of pastel shades give this design a feminine energy.

Swiss design (aka International Typographic Style) is a classic style which began to emerge in the 1920's, and is still influencing designers to this day. In Swiss design, typography is king. Common hallmarks of Swiss design include large, geometric typefaces (most ubiquitously Helvetica), rigid alignment to a multi-column grid, and carefully-placed flush-left text. Color is used liberally, but usually no more than one color is used in a piece.

Originating from architecture, the term "Brutalism" refers to design that is intentionally raw and unpolished. In the context of web design, this usually means rejecting commmon user interface patterns in favor of presenting a design so aggressive it almost shocks the user into sticking around to enjoy the content.

But hey, if it's not your thing, I understand. , there's plenty more.

UI Engineer
Click on a letter of my name

TDECU

Primary web presence for Texas-based credit union

  • Designed and implemented a brand new look and feel for TDECU's entire web presence.

  • Created a pattern library to document and catalog all front-end components.

  • Continued to shepherd the site and brand through multiple future redesigns and refactors.

TDECU is the largest credit union in Houston, TX. During my time at EAS, we were asked to execute a full website and content refresh for the main TDECU web presence. I led the initial design and front-end development side of this undertaking, and with assistance from back-end developers and content strategists, we brought TDECU from a lingering, outdated design into a web presence fit for 2022.

Showing tdecu.org homepage with dropdown expanded.
Showing tdecu.org homepage with dropdown expanded.

Financial institutions like credit unions are generally resistant to change and new ideas, so the TDECU site was far behind the curve when it comes to a modern web experience. The site was not responsive, the information architecture had suffered as new pages were simply tacked on, and the team had little consistency in terms of design. For example, most pages featured a banner image, and these banners were created by individual teams on the TDECU site, leading to disorientation and weak visual consistency as a whole across the site.

To begin, I created a pattern library of all the front-end components we would need to build the new site. I started at a high level with a style guide, outlining the standard colors and typography that would define the TDECU web brand.

Showing product comparison table.
Showing product comparison table.

I then moved into design and implementation of specific components that we would be using to compose the final site. Modules which were previously a disparate collection of loosely similar pieces - such as the hero banners - became true standardized components, with options exposed via the CMS to control their individual properties.

Showing definition file, template, and CSS for example backend module.
Showing definition file, template, and CSS for example backend module.

Once the pattern library was complete, the components were integrated into the CMS, and content strategists worked to author the final pages in the CMS.

Since taking ownership of the TDECU web properties under our wing, the brand and site have been through multiple visual front-end redesigns as well as refactoring of the back-end technologies. Each time we have carefully managed these transitions, identifying regressions and filling in the gaps where needed.

Back to all projects