Every movement begins with a moment.
Before launching full force into my blog, I’ll start by introducing you to three key people who play a critical role in developing truly engaging, intuitive and effective digital experiences.
• The User Experience (UX) Designer – The UX Designer works on the functional layout of the User Interface (UI). His or her process is more analytical and focuses on delivering an experience that aligns with natural/typical human habit and behavioral intuition. The UX Designer’s role can be far more complex than that, mind you, but essentially he or she ensures that the experience a user has on the website is fluid, consistent and intuitive.
• The Web Designer – The Web Designer, also referred to as a UI Designer, is the person who adds aesthetics on top of the UX design, usually in the form of wireframes. This person creates the look and feel of the website — color palette, photography, graphics, font types and so on.
• The User Interface (UI) Developer – A UI Developer (aka the subject of this blog’s headline) is the person who brings the static design to life. He or she connects the machine to the design and the design to the end user.
I started in Web development when Geocities was a popular place to publish your website and scrolling text banners was a “cool” animation.
I Love the InterWebs!
In the early years, UI Developers were few and far between because most software companies considered the position to be a luxury rather than a necessity. In their minds, Software Engineers were perfectly “capable” of building a user interface with out-of-the-box components, which were functional for the purposes of the product.
Meanwhile, in the world of advertising, most of the market was saturated with Flash developers. It made perfect sense: HTML-based functionality was limited in sizzle. And as the program’s name indicates, Flash enabled developers to achieve a much more “flashy” experience for their users.
But when the iPhone made its mark on history, Flash quickly fizzled out. And that’s when the industry shifted. The next generation of UI Development emerged under the name of “HTML5 Technology.”
In Moxie’s nascent days, UI developers had little insight into the project until the development project kickoff meeting. But soon Moxie’s Technology leadership team made a push to include Lead Developers early on in the process. The theory was that it would help the team seamlessly connect the dots from initial concept to the final experience. They were right. Not only did we adapt quickly, but the benefits of the new process became apparent almost immediately — especially in terms of efficiency, communication and collaboration. So what are some of key contributions that come with having a developer involved from the start?
Web technology has come a long way in just the past few years. Look back only half a decade and you can see the leaps and bounds the Web has made while viewing newly published websites. This may not be as apparent to end users as it is to developers, who have hands-on experience working with an ever-expanding arsenal of evolved tools. The technology and architecture just keep getting better and better (and better).
For example, the libraries and frameworks now available have freed up ample time for UI developers to add the subtle design enhancements we get excited about building. We construct these interfaces day in and day out — tinker, delete, rebuild. We’re constantly looking at other developers’ code for new projects to dive into and, in the process, come across some beautiful user interactions. We work in pixels, but we also work in elements and components. So when three horizontal lines signify a menu and an X signifies a close, why not animate the hamburger menu into an X and back again to a hamburger? UI Developers make these design decisions all the time while building out a website and are constantly assessing the smaller design and interaction nuances.
UI Developers work with everyone on the project — marketing, analytics, design, project management, you name it. Once the project hits development mode, we get all kinds of information from the various folks involved. Bringing a UI Developer into the first rounds of brainstorming is like having a gut-check expert in the room. Of course everything should be vetted through its respective expert, but until that time comes you can rely on your UI Developer to give accurate feedback.
UI Developers also see the whole picture. With data speeds getting faster, we’ve had the luxury of adding more images, larger graphics and — waaaaaaaait for it — videos for backgrounds! It’s all very exciting and lovely, but there are two very important things to consider in order to ensure that your beautiful design can, and will, reach the intended audience:
• Ease of data consumption — Not everyone has high-speed Internet. I know it’s hard to believe but, alas, it’s true. There’s a whole subset of users out there who can’t download 37 images on your beautiful new homepage in the 5 milliseconds you have to create a lasting engagement.
• Speed of page load – Yes, it still matters and, no, not just because Google says so. Data isn’t free, after all. And not everyone has the deep pockets it takes — and would love to have — to consume large amounts of it between billing periods. In fact, one ISP has started charging users for data consumption after a certain limit has been reached. So now even our broadband has data restrictions unless you want to hand over your dolla dolla bills, y’all.
Finally, if you have a client who needs a rebranding or a redesign to give its users a fresh look and access to updated content, sometimes it’s better to trade in the big ideas for a more agile UX. Step back and consider how much the end user will appreciate (or resent) your site if it site swallows up 40MB of their data plan. Or think about how frustrated a consumer might be when trying to quickly find information while your site’s content loads at a nice, leisurely pace. A developer will automatically calculate these potential UX pitfalls when too much sizzle has been added and provide proper feedback.
This is where your UI Developer might start to really rein in the creatives’ desires, yet he or she will also have excellent suggestions on alternatives. Of course we should push the boundaries of what has been done. But even something that’s seemingly small to a designer can lead to unnecessary technical complications.
As previously stated, UI Developers have hundreds of thousands of repositories of code out there — places where we collaborate, discuss and collective elevate the beauty we can build into our websites. This collaboration also means it has been tested, peer reviewed, tested again, tweaked and, for the most part, ready for use. Designing a website that is overly cutting edge is a poor use of client time — and by “time” I mean money (Yes, I said it).
The truth is, this approach can bloat the timeline significantly, lead to infrastructure issues and result in post-launch errors (aka bugs). Because the developer will need to figure out the best way to build it from scratch, then test across multiple operating system and browsers (while also keeping in mind that a lot of those browsers are duplicated across the aforementioned multiple operating systems) and a plethora of mobile devices. *Breathe*
For example, the Chrome browser is available on Mac, Windows, Android and iPhone/iPads. That is one browser across multiple operating systems with different versions in use. There’s also Internet Explorer starting at IE8, FireFox, Opera (okay, hardly anyone uses Opera), Safari and the default Android browser. (BTW, thank you, Android, for that one.) I’m not sure if it’s necessary to continue listing the reasons, but from what I just expressed, you can get an idea of why cutting-edge design work on a site can lead to poor architecture and execution. Use what is out there: It’s beautiful, functional and, most importantly, already tested.
UI Developers are creative and technical, which makes us an invaluable sounding board for the team and project from the very beginning. Although we have already come a long way in staffing and leveraging the UI Developer, we still have some walls to break down.
First, please don’t simply ask if something is or isn’t feasible or correct off the bat. Invite your UI Developer to have a conversation and provide input, rather than requesting that he or she answers specific questions. Most of the time you will only be given specific answers anyway. UI Developers have ideas, but they want to respect the position of the designer, which means we don’t always volunteer a lot of what we’d really like to share.
My final note is for all the current and aspiring designers out there: Build a few websites. Even better, build a few of your own designs. If you don’t know where to start, ask one the developers you work with; he or she will gladly show you the ropes. The experience will open an entirely new realm of understanding for you and, in the process, make you an invaluable asset to your team.
Do you have feedback for UI Developers on their contributions? Please comment below.
Note from Author:
Although this post is based on my personal experience and interpretations throughout my career as a developer, I have been greatly influenced over the years by the writings of Steven Bradley on vanseodesign.com blog.
PLEASE PROVIDE YOUR INFORMATIONTO DOWNLOAD THE PAPER.