Code & Development
Open Transclude
The Website Obesity Crisis
A Talk by Maciej CegłowskiWeb Design - The First 100 Years
A Talk by Maciej CegłowskiVisualizing Algorithms
An Article by Mike BostockAias
A Profile by Nick TrombleyThe Future of Programming
A Talk by Bret VictorWhat Makes Software Good?
An Article by Mike BostockAn incoherent rant about design systems
An Article by Robin RendleNo matter how fancy your Figma file is or how beautiful and lovingly well organized that Storybook documentation is; the front-end is always your source of truth. You can hate it as much as you like—all those weird buttons, variables, inaccessible form inputs—but that right there is your design system.
...being honest about this is the first step to fixing it.
Right-Angle Doodling Machine
A Game by Clive Thompson- You draw one single line. It can be as long as you like.
- To start the line, you put your pen down.
- You can make right-angle turns only, either 90 degrees or -90 degrees.
- You cannot back up. You must always move forward.
- You don’t lift your pen until you’re ready to stop. When you lift the pen, the doodle is done.
What do I need to read to be great at CSS?
An Article by Baldur BjarnasonA rule of thumb is that the importance of a blog in your feed reader is inversely proportional to their posting cadence. Prioritise the blogs that post only once a month or every couple of weeks over those that post every day or multiple times a day...Building up a large library of sporadically updated blogs is much more useful and much easier to keep up with than trying to keep up with a handful of aggregation sites every day.
Designing with code
An Article by Matthew StrömRecently I’ve had a few opportunities to use code to create design. In two of my bigger projects at The Wall Street Journal, writing code has led to new ideas. Problems that typically plague early designs — e.g. “how does this look with real content?” — are easy to solve. By exploring visual ideas directly in code, I’ve started to see the amazing potential of code as a design tool.
Picking better names for variables, functions, and projects
An Article by Tom MacWright- Avoid weasel words
- Follow patterns religiously
- Don’t cheap out on characters
- Call things the same thing
- Don’t name internal projects
- When things change, change their names
this vs. that
A Website by Phuoc Nguyentixy.land
A Websitesin(t * x) * cos(t * y)
Creative code golfing.
Front-of-the-front-end and back-of-the-front-end web development
An Article by Brad FrostA succinct way I’ve framed the split is that a front-of-the-front-end developer determines the look and feel of a
button
, while a back-of-the-front-end developer determines what happens when thatbutton
is clicked.The Great Divide
An Article by Chris CoyierOn one side, an army of developers whose interests, responsibilities, and skill sets are heavily revolved around JavaScript.
On the other, an army of developers whose interests, responsibilities, and skill sets are focused on other areas of the front end, like HTML, CSS, design, interaction, patterns, accessibility, etc.
Painting With the Web
An Article by Matthias OttSo much about [Gerhard Richter's painting process] reminds me of designing and building for the Web: The unpredictability, the peculiarities of the material, the improvisation, the bugs, the happy accidents. There is one crucial difference, though. By using static wireframes and static layouts, by separating design and development, we are often limiting our ability to have that creative dialogue with the Web and its materials. We are limiting our potential for playful exploration and for creating surprising and novel solutions. And, most importantly, we are limiting our ability to make conscious, well-informed decisions going forward. By adding more and more layers of abstraction, we are breaking the feedback loop of the creative process.
Technical debt as a lack of understanding
An Article by Dave Rupert"If you develop a program for a long period of time by only adding features but never reorganizing it to reflect your understanding of those features, then eventually that program simply does not contain any understanding and all efforts to work on it take longer and longer.” — Ward Cunningham
bees & bombs
A Blog
Design Thinking
Ducks and decorated sheds
A duck is a building whose confirmation is a complete symbol or icon. A decorated shed is a building to which symbols, often commonplace signs, have been attached.
Clinging to ideas
Another aspect of design thinking that was evident in the foregoing case studies is the tenacity with which designers will cling to major design ideas and themes in the face of what at times might seem insurmountable odds. Often the concept the designer has in mind can only come to fruition if a large number of apparently countervailing conditions can be surmounted.
Even when severe problems are encountered, a considerable effort is made to make the initial idea work, rather than to stand back and adopt a fresh point of departure.
A concept of style
It is a concept based not on the classification of various physical features of architecture and urban design but on the problem-solving process itself. We have seen that the final outcome of a design process is strongly determined by at least three aspects of that process:
- the subject matter of the organizing principles which are adopted,
- the manner in which these principles are interpreted and reinterpreted in the context of the problem at hand, and
- the sequent of applying such organizing principles.
Consistency in style among the output of designers can thus be understood as a habitual way of doing things, of solving problems.
Form and figure
Form applies to “a configuration with natural meaning or none at all,” whereas figure applies to “a configuration whose meaning is given by culture."
Design skirmishes
it is apparent that the unfolding of the design process assumed a distinctly episodic structure, which we might characterize as a series of related skirmishes with various aspects of the problem at hand.
As the scope of the problem became more determined and finite for the designer, the episodic character of the process seems to have become less pronounced. During this period a systematic working out of issues and conditions took hold within the framework that had been established. This phenomenon is not at all surprising when we consider the fundamental difference between moments of problem solving when matters are poorly defined and those with clarity and sufficiency of structure.
Within the episodic structure of the process, the problem, as perceived by the designer, tends to fluctuate from being rather nebulous to being more specific and well-defined. Furthermore, moments of "blinding" followed by periods of backtracking take place, where blinding refers to conditions in which obvious connections between various considerations of importance go unrecognized by a designer.
Such plans were deemed efficient
The terrain of cities was subdivided along the lines of distinct and discrete patterns of use, with very little opportunity for mixing (separation and concentration of functions). After all, the home environment should be just that…while places of work should be aggregated and serviced with their appropriate supporting functions.
Such plans were deemed efficient.
Constrained by the medium
The inevitable reciprocation that occurs between the act of drawing and the thinking associated with it. The hand moves, the mind becomes engaged, and vice versa. We might ask: How much does the medium of expression actually constrain a design process?
A medium has a way of constraining our choices, and this influence may not involve conscious choice at all. The planner, in the end, sees and understands only those things for which they can provide expression.
Autonomous constraints
Autonomous or independent constraints do not derive from the problem as given and understood…there was nothing in the problem statement, or brief, that required any reference be made to it. This constraint, introduced by the designers, usefully transcended the givens of the problem situation.
Unless the entire problem at hand can be solved using strictly problem-oriented constraints, we have to step outside the known problem context in order to continue problem solving activity.
The strange familiar and the familiar strange
The problem solver, when confronted with a new and yet unsolved problem, overlays the structure of the unsolved problem with an apparently similar problem with which he or she is experienced.
Making the strange familiar and the familiar strange are also principally based on the use of analogy.