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!
On September 8, we at Voyager hosted the general assembly of First Pacific Chief Information Officers Council and simultaneously held a digital transformation learning sessions with them.
CSS Objects are selectors.
CSS Buckets are rules.
Prioritize defining objects over defining rules.
[codepen_embed height=”265″ theme_id=”dark” slug_hash=”LjjVWE” default_tab=”css” user=”BrianSahagun”]See the Pen CSS Jot Down 1: Prioritize Objects by Brian Dys Sahagun (@BrianSahagun) on CodePen.[/codepen_embed]
The purpose is to make each object independent.
Use CSS variables for shared styles when possible.
Someday soon, there will be a CSS function that would apply a rule to a selector.
Combine objects:
Prioritize objects:
Just read this book – Don’t Make Me Think by Steve Krug – in two nights straight and even if the 2nd edition was in 2005, the wisdom that I got from it is still relevant.
And in the footnotes I came to discover “new” reads:
As an exercise on Front-End Development, The UI Team took a screenshot from instagram.com and treated it as if it were a design mockup.
We then proceed to deconstruct its Structure and Skeleton (Elements of UX) thru Information Architecture, Interaction Design, Information Design. The knowledge that arose in this deconstruction was used in building the HTML and CSS.
See the Pen RE:Creation: Instagram by Brian Dys Sahagun (@briandys) on CodePen.
We, as Visual Designers, have experienced how time-consuming it was to build the Front-End of a design mockup basing only on a simple image.
The Design Handoff warrants to have more than the Brand Guidelines, Style Guide. It must also have some form of Information Architecture and Interaction Diagram that could greatly make Front-End Development faster.
Commenting is disabled.