Hey there! Brian Dys here — I’m a visual and visceral person at heart. Ever since my mom lent me her old film camera, I fell in love with photography. All of my creative musings were exemplified by my second brain, the computer. This journey is a topsy-turvy ride of creative pursuits — from electronic music to UX design.
I enjoy every dull and wild moments of it — yes, this life of mine that I share with a woman named Jaycelle and a boy named Bryce. Take a peek into my kaleidoscope!
What are other web design tools available out there other than Photoshop?
Web design has evolved from being focused on graphics down to being focused on content and experience. Even imagine the time when web design was done using Flash.
This is one of the reasons why in the past, that a photo-editing application like Photoshop was a perfect tool for web designers-we can create elaborate graphics and at the same time export HTML and CSS.
Web designers can still choose to do it that way, only that there are already a wide variety of applications that specifically cater to web and mobile design – and up to a certain point – development. Even Adobe has XD to contend with Sketch and InVision DSM.
So, yes, there might be web designers who didn’t find a need for Photoshop in any of their web projects. And that’s ok.
Ideally, design guides, brand guidelines, style guides, etc. are based on research.
They did not appear in a vacuum.
Collaborate with the people who made the guides and find out if you are aligned with the same objectives.
The user and business objectives are the guidelines for the team, whether in UI design or frontend development.
These are the Elements of UX according to Jesse James Garrett:
UI Design practically comes after having objectives and requirements. It constitutes the design of the interface based on Information Architecture and Interaction Design.
The Elements of UX shows the abstraction of what constitutes UX Design. It involves the whole process of research and testing at different planes and at different stages of the process.
Now, must a UI designer dive right into UI design without referring to any previous work done such as objectives and requirements, information architecture and interaction designs?
What is the mental model of the user interface—or at least the UI buttons?
Just like with most physical buttons, if a user wants to press it, he or she touches it. The feedback comes from its look and feel (it looks like a button; it feels like it can be pressed by actually pressing it).
With UI buttons, a user could get feedback from the following:
With some techniques in Visual Design, a designer could reinforce the feeling that the button functions as expected.
Does the button budge up when hovered? Or does it budge down?
If up, then the shade becomes lighter as it moves closer to the light source—which is naturally above us (in the real world). If down, then darker.
Does the button light up when hovered?
If yes, then the shade becomes lighter—whether the light comes from the body of the button or simply around the button.
You may combine those different techniques—but basically, those are the considerations why the shade of a button would be darker or lighter when hovered.
Please note that for devices with pointing device, the mouse changing to a pointer is enough feedback for the button to feel like it is clickable.
However, for touch devices, to feel like it is clickable, a user will actually press it.
If it stemmed from the same campaign, they all could have the same objectives.
Only at the Structure level—specifically, Information Architecture—they could be the same.
For the interface (UI), the differences are obvious—that as of this moment, physical flyers can’t handle HTML yet.
What kind of content are you presenting?
Take a look at Facebook feed and Pinterest feed.
Facebook feed presents a variety of content—text, images, videos whose purpose are to update the users of current events and happenings in their friends’ lives.
Pinterest feed, on the other hand, presents content heavy on images—eye candy if you may.
So for timely content like news, it’s best to present it linearly (single–column) beginning from the most relevant and recent.
For content meant to be browsed or scanned, it’s best to present it all at the same time (multi–column), of course also beginning from the most relevant to the user.
Relevance is key.
