Future popcorn 🔮🍿
Frontend Guidelines V2
Less words, more useful. 👍
Delightful Dev Experience
- Use an isolated component dev env. Keep it browsable/visual for all components and variations. Storybook, Cosmos, KSS, Atomic, PatternLab
- Borrow existing –and prioritize writing– reusable components, types, and utils.
- Keep builds fast and reliable. Use mock data.
- Choose readability. Keep code approachable, assume you’ll forget.
- Be free to work incrementally, ship/share unimplemented code while it’s fresh!
Delightful User Experience
- Provide instant feedback and obvious affordance.
- Iterate and refine great UX, with your rapid-build isolated dev env 😉
- Work on features within broader UX context(s).
- Be minimal, fine-tune visual weight.
“…are you asking the American public to give up one television channel for science? Whoever heard of anything so absurd?”
“Without resistance, a commercial use-case will usurp a non-commercial use-case for a given resource.”
WARNING: RADIO-ASTRONOMY & HISTORY AHEAD…
Nerd Rant on Code Readability 🤓
“All software hinges on one technique– problem decomposition.” John Ousterhout
Quarantine has me diving into code architecture learning. Here are some opinions about programming. The internet needs more right?
Software is just a collection of abstractions, plenty of layers even before “the code”. Newcomers to any codebase are forced to climb toward a summit of understanding, grasping each abstraction like a hand-hold, reaching for awareness. We know this path is made treacherous as systems grow unless you build it to be explored.
We know that the ability to alter code is rooted in easily grasping momentary clarity of the pieces around what needs to change. Engineers must leverage brief glimpses of the whole.
Often organizations end up managing complexity with domain experts– people who’ve put down roots in a system. Once you’ve traversed the hierarchies and pathways enough, you recognize the sign-posts. You eventually internalize obtuse abstractions. Programmers literally mimic algorithms in their brains to simulate the systems they work on, these eventually become gray folds. The code gets in. But software cannot rest on the narrow and deep knowledge of specific senior architects and lead engineers… a priesthood of surgeons who understand the veins and organs of an application. I digress.
The hard truth is that much of software’s value is actually in its flexibility and maintainability. The value is adapting to the world, solving evolving problems, actually fixing bugs, and not becoming obsolete! This is also the main cost of software– paying the people trying to make it work.
What’s evident, and undervalued, is that all this abstraction must serve understandability as a core goal. The value of sloppy and short-sighted code doesn’t last long. There’s a brief spike as it’s deployed… but any future change attempts expose the debt. The “understanding costs” and extensibility costs will end up on the balance sheet.
So what next?
Obviously, none of this is new. It’s just on our minds while stuck at home in 2020/21. I’m paraphrasing more than being original. If you want to keep reading, click one of these…
- ShapeUp - make bets with your sprints
- Clean Architecture [videos] - iteration guidelines to avoid paralysis
- Information Hiding / Deep Classes - reduce knowledge burden
- Single Responsibility Principle - do one thing well
- Spiral Model - let risk targeting be your guide
- Pattern Glossary - use agreed upon jargon
- Art of Code - code for it’s own sake
- Naming, apparently it’s the most important thing.
Serve the constant goal of readability, cuz you’re a goddam professional.
Docs on Ads and Propaganda
Working on a publishing SaaS platform and chaotic 2020 politics had me curious again about the history of advertising / psychology / image media. Here’re a few documentaries worth watching about once a decade and are still quite relevant.
📺 The Century of the Self (BBC, 2002)
How subconscious desires are leveraged for commerce and control. Focused on Edward Bernays (advertising) and Sigmund Freud (psychotherapist, duh). Wikipedia link
📺 Project “Re: Brief” (Google, 2012)
Experiment to reimagine iconic 1960/70s advertisements in the online age, created by their original author(s) and young collaborators. Brands like: Volvo, Alka-Seltzer, Coca-Cola, etc. participate.
📺 Art in the Age of Mechanical Reproduction (BBC, 1935)
Explores the perception, purpose, and value of artwork/images in the human era beyond the limits of handcraft. Wikipedia link
Frontend Guidelines V1
VERSION TWO
Code should clearly state its purpose. For best results, it should guide contributors with basic principles. Values differ within an application stack and need to be clarified. These are for the frontend, some may be relevant elsewhere. Feedback welcome.
Delightful Dev Experience
- prioritize readability, clarity, approachability, and assume you’ll forget
- provide instant-feedback workflow for components and variations
- nest coupled code together, extract and elevate reusable bits
- keep builds fast and reliable, enable frequent testing
- borrow repo norms, format and lint on save
Delightful User Experience
- provide instant interaction feedback
- don’t distract or context switch
- be minimal, fine-tune visual weight
- track end-user interactions including errors/warnings
Stay Isolated
- create reusable, decoupled elements
- use static mock data (at least for initial state)
- minimize external services, register/identify when you do
Use Existing Tools
- avoid re-building commodity features, unless core to your point
- inherit and collaborate on types and API interfaces
- leverage existing code and frameworks, or delete it
- keep automation simple and empowering
Make it Flexible
- easily adaptable has more actual value than barely working
- think configuration first
- allow design choices to be easily propagated
- be a data model stakeholder
Work Incrementally
- ship unimplemented code early while fresh
- expose your work to colleagues
- test ideas in chunks, get data, follow the truth
Eleventy (11ty) looks cool.
Is @eleven_ty the new @metalsmithio?
Seeking humanity in code
If you write code for social tools, you have the opportunity and responsibility to ensure the systems you create do not amplify the failings and biases of the offline world.
Online convo space is one of the main public forums shaping our societies today. Due to the worst parts of human behavior, these spaces need basic protections. Never to censor, never to squash violent truth, but to allow and enable fruitful communication.
My job has recently required finding solutions to this messy problem. Here’s a few resources I’ve found to work from…
- Chicago Principles (university model)
- Disqus Basic Rules
- Reddit Unwelcome Content Policy
- Facebook Community Standards
- Twitter Hateful Conduct Policy
Looking to pinpoint hate systematically to enable moderators? Try this…
https://github.com/tensorflow/tfjs-models/tree/master/toxicity
LIVE from WFH.
Sometimes #INFOWAVE, sometimes #WORKCHILL, occasionally #BITMUCH
It’s harsh to say “people move import statements or blocks of code randomly around until it ‘suddenly works.’” But I appreciate the depth on how file loading is actually happening in React… and exactly what assumption circular dependencies can deny.