Author: Brian Dys

  • Exploring Name—Description—Purpose (NDP)

    But I know every rock and tree and creature
    Has a life, has a spirit, has a name
    Colors of the Wind

    In terms of User Interface Design, every element must serve its purpose—its reason for being. In able to be identified, it must have a name and a description of what it does.

    The Name—Description—Purpose Information Structure or NDP becomes a tool in identifying any UI element within a system. The Designer would have a glimpse of what it is called (Name), what it does (Description), and why it exists (Purpose). (more…)

  • If you are a UI/UX designer, what would you choose, to be an all-around with average skills (design + programming) or be a champ in UI/UX only?

    Be a jack of all trades and a master of none or a master of one (and more)? It is an age-old question.

    It depends on the environment where you want to focus on:

    • in a one-man band freelancing: jack of all trades
    • in a company with team members with specializations: specialize
    • in a company with “all-around” team members: jack of all trades

    In general, be the best at one thing and not so best or at least familiar with other things.


    Originally published in Quora

  • Why don’t many professional web designers disable the outline (blue glow) around input fields, even if it clashes with the design and color scheme?

    There are many default usability styles designed by the browser.

    Sometimes it is best to leave it alone because it covers a lot of area that you might not be able to cover if you nitpick it.

    Now if the color of the outline clashes with your branding like “blue is really banned from your UI” then change it.

    Or if the outline color is the same as the background color, it won’t be seen, of course, so change it.

    It’s important to note that styles whose main purpose is usability must be left alone especially if your purpose is to simply comply with color schemes.


    Originally published in Quora

  • How do I know which CSS attributes work on each HTML tags?

    There are initial points to take into consideration in order to make sense of the connection between HTML elements (<p>, <a>, <div>, etc.) and CSS properties (display, font-size, background-color, etc.).

    1. The nature of the HTML element
    2. The purpose of the HTML element

    You might notice that it is all about HTML elements. This is because HTML elements already have implicit CSS rules in them thru the browser. It is called the User Agent Styles or browser default styles.

    Now your question borders around creating your own styles, thus, overriding the default styles.

    (more…)
  • Designing a Design Team

    Notes

    • Roles & Capabilities
    • Culture
    • Skills & Personalities
    • Reliable & Resilient
    • Flexibility in the Roles
    • Learning other areas
    • Do not design in an assembly line — always have a view of the bigger picture

    The Interview

    • Passion. What motivates them?
    • Curiosity. Are they willing and prone to ask important questions, especially before they start creating?
    • Communication. How do they articulate the problems they’re working on? How do they help others understand the solutions they’re considering?
    • Engagement. What’s their view of the design process? What steps do they take to approach it?
    • Autonomy. Are they able to understand the big vision and work toward it? Are they pushing the team forward with new insightful ideas, or are they dragging it behind by needing to be told what to do next?
    • Reveal themselves — strengths and weaknesses

    The Tests

    • Technical
    • Problem-solving Capabilities
    • Take–home Tests regarding a real-life problem they have
    • Criteria
      • Design concept
      • Structure
      • Consistency
      • Problem solving
      • Creativity
      • Presentation

    References

  • What is a good “test project” to prove one’s skills as a UI designer (to work with a UX person) for a website development company, e.g, if one’s portfolio is out-of-date, but they have prerequisite talent & skills?

    Let’s frame your question in the following:

    • You’re applying for a web development company
    • Your portfolio currently would not demonstrate your superpowers
    • But a Test Project will
    • You are applying for a User Interface Designer position
    • In the company, they have a UX Researcher and a UX Designer in the team
    • You would like to foresee the Test Project that they will give you to be able to prepare for it
    (more…)
  • Why does experimenting with CSS feel so overwhelming?

    One might categorize CSS experimentation into two:

    • Static experimentation (visual design – layout colors, typography)
    • Interactive experimentation (animations, interactivity)

    Now, both could be overwhelming especially if you’ve already gotten past the visual design properties.

    But yeah, that’s the way it is – whatever you’re building, you just have to take it one block at a time to be able to manage it – and lessen the overwhelmingness.


    Originally published in Quora

  • In UI design, where is the line between copying someone and getting inspiration?

    I could see this question in two aspects: the designer’s POV and the audience’s POV

    • The designer’s personal POV about replicating and modifying depends on her philosophy.
    • Is it OK to copy just to get it done? Is it OK to spend time to reinvent the wheel? What will the designer learn from it?
    • What will the designer’s audience think about the practice of copying visual designs? What will the audience feel about a familiar experience in the design?

    There are many different considerations when someone seems to have a similar UI design. I could see the thin transparent line all over the spectrum.


    Originally published in Quora

  • What are the most common CSS tricks for media queries?

    The most common approach in using media-query, which is also strategic, is abiding by the Mobile First principle.

    • Begin your non-media queried style for mobile
    • Add a media query for the next viewport size you’re designing for. For example, tablet size then desktop size

    I mentioned strategic because it also tackles the concept of Less Is More or in other words, decluttering or prioritizing.


    Originally published in Quora

  • Reading about the Distributed Web.