interfaces
An open platform is essential
Web trails
gridless.design
A Website by Donnie D'Amatoget rid of the grid
Blasphemy, I need structure and order!"
The web is good at these things, just not in the ways that designers have been accustomed to working. We'll take a look at how we got here and how we might change our perspective. Let's think outside of the grid and allow other guidelines to provide a comprehensive layout.
Web Design is 95% Typography
An Article by Oliver Reichenstein95% of the information on the web is written language. It is only logical to say that a web designer should get good training in the main discipline of shaping written information, in other words: Typography.
Why Do All Websites Look the Same?
An Article by Boris MüllerOn the visual weariness of the web.
Cloudbusting
An Article by Daisy AliotoIt is fun to revisit memories this way, a digital stamp in my weather passport, where everything can be contained in a forecast and Stockholm sits between Vilnius and London by sheer chance. It has also been a way to feel close to people I love while traveling, to know whether it is raining where they are.
As with most technology, this is artistry by committee. There is no Thomas Cole waiting in the wings. But someone has to animate the stars, to decide when to streak one across the screen–to play god in our pockets.
Always Already Programming
An Article by Melanie HoffEveryone who interacts with computers has in important ways always already been programming them.
Every time you make a folder or rename a file on your computer, the actions you take through moving your mouse and clicking on buttons, translate into text-based commands or scripts which eventually translate into binary.
Why are the common conceptions of what a programmer and user is so divorced from each other? The distinction between programmer and user is reinforced and maintained by a tech industry that benefits from a population rendered computationally passive. If we accept and adopt the role of less agency, we then make it harder for ourselves to come into more agency.
The Finish Fetish Artists
An EssayFor others, perhaps especially those artists who worked with light and transparency and were involved in the birth of the Light and Space Movement, an immaculate surface is a prerequisite. Helen Pashgian explained this very clearly:
“On any of these works, if there is a scratch... that’s all you see. The point of it is not the finish at all – the point is being able to interact with the piece, whether it is inside or outside, to see into it, to see through it, to relate to it in those ways. But that’s why we need to deal with the finish, so we can deal with the piece on a much deeper level”.
The importance of a pristine surface calls for a very low tolerance to damage by the artists. The feeling is shared by Larry Bell:
“I don’t want you to see stains on the glass. I don’t want you to see fingerprints on the glass... I don’t want you to see anything except the light that’s reflected, absorbed, or transmitted”
Spatial Software
An Article by John PalmerSpatial Interfaces
An Essay by John PalmerSoftware applications can utilize spatial interfaces to afford users powerful ways of thinking and interacting. Though often associated with gaming, spatial interfaces can be useful in any kind of software, even in less obvious domains like productivity tools or work applications. We will see spatial interfaces move into all verticals, starting with game-like interfaces for all kinds of social use-cases.
Spatial Web Browsing
An Article by Maggie AppletonThere are some new apps appearing that offer alternative ways of browsing the web...This canvas-based approach adds spatial dimension to the web browsing experience; they allow us to arrange browser windows above, below, to the left, and right of other browser windows.
The same way we're able to put an open book next to a piece of paper and below a row of sticky notes in meatspace. Arranging objects in space to create groupings, indicate relationships, and build hierarchies is one of those classical human skills that never goes out of style.
How I Build
An Article by Pirijan KetheswaranIn 2014, I wrote about my belief that design and engineering are best when tightly woven together. That’s truer now than ever.
If I’m feeling confident, I’ll jump right into my text editor…From here, more functionality is added and the code is tweaked until the feature looks and feels right to me. Whether it’s something simple like this, or prototyping a new interaction like multi-connect, there’s no substitute for designing with real code.
In rare cases when I have ideas or plans that I’m less confident about, it’s time to break out the paper, pens, and markers,
Because the Kinopio interface elements and aesthetic are full-grown, I almost never use traditional design software anymore.
In search of visual texture
An Article by Rachel PruddenI’m now more inclined to attribute Looseleaf’s power to its visual texture than to some cognitive media-style abstraction. And the visual texture owes more to the beauty (yes, beauty!) of the original pdfs from the Vasulka Archive. Perhaps the demo is best understood not as a prototype generic tool, but as a specific curated experience in its own right, with form and content claiming equal importance in its overall success.
Even so, I think there are some general lessons that can be drawn from this demo:
- Content is not inert
- Visual texture lets content breathe
- Visual texture lets the eye wander without losing itself
Menus, Metaphors and Materials: Milestones of User Interface Design
An Article by Boris MüllerStudents traditionally learn art and design by studying the masters, analyzing, sketching and interpreting the grand visions of the past. In doing this, they get to understand the ideas, concepts and motivations behind the visual form.
In user interface design, this practice is curiously absent.
press.stripe.com
A WebsiteStripe partners with millions of the world’s most innovative businesses. These businesses are the result of many different inputs. Perhaps the most important ingredient is “ideas.”
Stripe Press highlights ideas that we think can be broadly useful. Some books contain entirely new material, some are collections of existing work reimagined, and others are republications of previous works that have remained relevant over time or have renewed relevance today.
Embracing Asymmetrical Design
An Article by Ben NadelHumans love symmetry. We find symmetry to be very attractive. Our brains may even be hard-wired through evolution to process symmetrical data more efficiently. So, it's no surprise that, as designers, we try to build symmetry into our product interfaces and layouts. It makes them feel very pleasant to look at.
Unfortunately, data is not symmetrical…Once you release a product into "the real world", and users start to enter "real world data" into it, you immediately see that asymmetrical data, shoe-horned into a symmetrical design, can start to look terrible.
To fix this, we need to lean into an asymmetric reality. We need to embrace the fact that data is asymmetric and we need to design user interfaces that can expand and contract to work with the asymmetry, not against it. To borrow from Bruce Lee, we need to build user interfaces that act more like water:
“You must be shapeless, formless, like water. When you pour water in a cup, it becomes the cup. When you pour water in a bottle, it becomes the bottle. When you pour water in a teapot, it becomes the teapot. Water can drip and it can crash. Become like water my friend.” — Bruce Lee
Changing Our Development Mindset
A Fragment by Michelle BarkerWe simply can no longer design and develop only for “optimal” content or browsing conditions. Instead, we must embrace the inherent flexibility and unpredictability of the web, and build resilient components. Static mockups cannot cater to every scenario, so many design decisions fall to developers at build time. Like it or not, if you’re a UI developer, you are a designer — even if you don’t consider yourself one!
...Sometimes interpreting a design means asking the designer to further elaborate on their ideas (or even re-evaluate them). Other times, it means making design decisions on the fly or making recommendations based on our knowledge and experience.
AJDVIV
A WebsiteThe Fidelity Curve
An Article by Ryan SingerHow do we choose which level of fidelity is appropriate for a project?
I think about it like this: The purpose of making sketches and mockups before coding is to gain confidence in what we plan to do. I’m trying to remove risk from the decision to build something by somehow “previewing” it in a cheaper form. There’s a trade-off here. The higher the fidelity of the mockup, the more confidence it gives me. But the longer it takes to create that mockup, the more time I’ve wasted on an intermediate step before building the real thing.
I like to look at that trade-off economically. Each method reduces risk by letting me preview the outcome at lower fidelity, at the cost of time spent on it. The cost/benefit of each type of mockup is going to vary depending on the fidelity of the simulation and the work involved in building the real thing.
What UI really is (and how UX confuses matters)
An Article by Ryan SingerPeople mix the terms UI and UX together. UX is tricky because it doesn’t refer to any one thing. Interface design, visual styling, code performance, uptime, and feature set all contribute to the user’s “experience.” Books on UX further complicate matters by including research methods and development methodologies. All of this makes the field confusing for people who want to understand the fundamentals.
That’s why I avoid teaching the term ’UX.’ It means too many things to too many different people. Instead I focus on individual skills. Once you understand the individual skills, you can assemble them into a composite system without blurring them together. For software design, the core skill among all user-facing concerns is user interface design.
User Inyerface
A WebsiteA worst-practice UI experiment.
Beyond Artboards
An Essay by Chuánqí SunThe Pursuit of Lossless Design-Development Handoffs.
Intelligent arrows
A Fragment by Chris CoyierReminds me of a little feature I like in Notion where if you type dash-arrow (like ->) it turns into → — but intelligently — like it doesn’t do that with inline code or a code block.
Safari 15 isn't bad, just misunderstood
An Article by Jeff KirvinWhat I see in Safari 15 is the first steps into a new design language for iOS, one prioritizing adaptive, contextual interfaces. Ever since the move to the new “all screen” iPhone X design, content has been king on iOS, and Apple has been removing more and more user chrome. This is the next step on that journey.
The Nine States of Design
An Article by Vince Speelman- Nothing
- Loading
- None
- One
- Some
- Too Many
- Incorrect
- Correct
- Done
State of the Windows
An ArticleHow many layers of UI inconsistencies are in Windows 10?
We’ve all heard this riddle: if you dig down deep enough in Windows 10, you’ll find elements that date from Windows 3.x days. But is it actually true? In this article we’ll discover just how many UI layers are in Windows and when they were first introduced.
narrowdesign.com
A Website by Nick JonesDesign
Prototype
CodeGuidebook: Graphical User Interface Gallery
A WebsiteGuidebook is a website dedicated to preserving and showcasing Graphical User Interfaces, as well as various materials related to them.
It's all just geek talk
A Fragment by Riccardo MoriI’m finding that many people not only have lowered their standards with regard to the user interface, but more and more often when I bring up the subject, they seem to consider it a somewhat secondary aspect, something that’s only good for ‘geek talk’. The same kind of amused reaction laymen have to wine or coffee connoisseurs when they describe flavours and characteristics using specific lingo. Something that makes sense only to wine or coffee geeks but has little to no meaning or impact for the regular person.
The problem is that if an increasing number of people start viewing user interface design as an afterthought, or something that isn’t fundamental to the design of a product or experience — it’s all just ‘geek talk’ — then there is a reduced incentive to care about it on the part of the maker of the product.
Pictures of Websites
An Article by Matthew StrömWhen I was a product designer, people would ask what I did for a living, and sometimes I’d answer “I draw pictures of websites.”
Sure, I could just say “I design websites.” That’s true. The end result of my work is (hopefully) that a website looks better, works better, or results in better outcomes.
But most of my day isn’t spent looking at the website, or working on the code of the website, or manipulating the website directly in some way. It’s spent in Figma or Sketch, drawing pictures of how I think the website should look and work.
Through some kind of alchemy, the pictures I draw have an impact on the finished website. But they’re not all the same.
The User Interface of URLs
A Research PaperURLs (Uniform Resource Locators) have rapidly become the standard method for specifying how to access information on the Internet. Although mostly used on the World Wide Web, URLs are also becoming more common for specifying locations for other distributed Internet services such as Gopher and anonymous FTP. Internet users see URLs both online and in print, and therefore URLs have visual interfaces. This paper gives an overview of many of the issues that concern the visual and user interfaces of URLs.
Web History Chapter 6: Web Design
A Chapter by Jay HoffmannAfter the first websites demonstrate the commercial and aesthetic potential of the web, the media industry floods the web with a surge of new content. Amateur webzines — which define and voice and tone unique to the web — are soon joined by traditional publishers. By the mid to late 90’s, most major companies will have a website, and the popularity of the web will begin to explore. Search engines emerge as one solution to cataloging the expanding universe of websites, but even they struggle to keep up. Brands soon begin to look for a way to stand out.
Unobtrusive feedback
An Article by Jeremy KeithThe text 'added' and 'removed' drifts upwards from the toggle button and fades away.
So we all know Super Mario, right? And if you think about when you’re collecting coins in Super Mario, it doesn’t stop the game and pop up an alert dialogue and say, “You have just collected ten points, OK, Cancel”, right? It just does it. It does it in the background, but it does provide you with a feedback mechanism.
The feedback you get in Super Mario is about the number of points you’ve just gained. When you collect an item that gives you more points, the number of points you’ve gained appears where the item was …and then drifts upwards as it disappears. It’s unobtrusive enough that it won’t distract you from the gameplay you’re concentrating on but it gives you the reassurance that, yes, you have just gained points.
The Mother of All Demos
A Lecture by Douglas EngelbartA name retroactively applied to a landmark computer demonstration, presented by Douglas Engelbart on December 9, 1968. The 90-minute presentation essentially demonstrated almost all the fundamental elements of modern personal computing:
- windows,
- hypertext,
- graphics,
- efficient navigation and command input,
- video conferencing,
- the computer mouse,
- word processing,
- dynamic file linking,
- revision control,
- and a collaborative real-time editor
The UX of Lego Interface Panels
An Article by George CaveTwo studs wide and angled at 45°, the ubiquitous “2x2 decorated slope” is a LEGO minifigure’s interface to the world. These iconic, low-resolution designs are the perfect tool to learn the basics of physical interface design.
Like, just a post complaining that screens should be better
An Article by Matt WebbIt’s been 19 years since Pixar released Monsters, Inc. with all that CGI hair. Where are my hairy icons? Ones that get all long and knotted as the notifications number goes up.
Why can’t I feel my phone? I found that paper from 2010 (when I was complaining about keyboards) about using precision electrostatics to make artificial textures on touchscreens.
I should be able to run my thumb over my phone while it’s in my pocket and feel bumps for apps that want my attention. Touching an active element should feel rough. A scrollbar should *slip. Imagine the accessibility gains. But honestly I don’t even care if it’s useful: 1.5 billion smartphone screens are manufactured every year. For that number, I expect bells. I expect whistles.
The Pale King
We change them and are changed
"We fill pre-existing forms and when we fill them we change them and are changed."
— Frank Bidart, Borges and I
Displacement
...the man fitted to his job like a man to the exact pocket of space he displaces.
What's wrong?
Pay attention, boy. The next suitable person you're in light conversation with, you stop suddenly in the middle of the conversation and look at the person closely and say, "What's wrong?" You say it in a concerned way. He'll say, "What do you mean?" You say, "Something's wrong. I can tell. What is it?" And he'll look stunned and say, "How did you know?" He doesn't realize something's always wrong, with everybody. Often more than one thing.
Narrative codes
The idea, as both sides' counsel worked it out, is that you will regard features like shifting p.o.v.s, structural fragmentation, willed incongruities, & c. as simply the modern literary analogs of 'Once upon a time...' or 'Far, far away, there once dwelt...' or any of the other traditional devices that signaled the reader that what was under way was fiction and should be processed accordingly. For as everyone knows, whether consciously or not, there's always a kind of unspoken contract between a book's author and its reader; and the terms of this contract always depend on certain codes and gestures that the author deploys in order to signal the reader what kind of book it is, i.e., whether it's made up vs. true. And these codes are important, because the subliminal contract for nonfiction is very different from the one for fiction.
An enormous machine
The couple of years in question here saw one of the largest bureaucracies anywhere undergo a convulsion in which it tried to reconceive itself as a non- or even anti-bureaucracy, which at first might sound like nothing more than an amusing bit of bureaucratic folly. In fact, it was frightening; it was a little like watching an enormous machine come to consciousness and start trying to think and feel like a real human.
Abstruse dullness
Consider, from the Service's perspective, the advantages of the dull, the arcane, the mind-numbingly complex. The IRS was one of the very first government agencies to learn that such qualities help insulate them against public protest and political opposition, and that abstruse dullness is actually a much more effective shield than is secrecy. For the great disadvantage of secrecy is that it's interesting.
To hide or dissemble
Fact: The birth agonies of the New IRS led to one of the great and terrible PR discoveries in modern democracy, which is that if sensitive issues of governance can be made sufficiently dull and arcane, there will be no need for officials to hide or dissemble, because no one not directly involved will pay enough attention to cause trouble.
Distraction
To me, at least in retrospect, the really interesting question is why dullness proves to be such a powerful impediment to attention. Why we recoil from the dull. Maybe it's because dullness is intrinsically painful; maybe that's where phrases like 'deadly dull' or 'excruciatingly dull' come from. But there might be more to it. Maybe dullness is associated with psychic pain because something that's dull or opaque fails to provide enough stimulation to distract people from some other, deeper type of pain that is always there, if only in an ambient, low-level way, and which most of us spend nearly all our time and energy trying to distract ourselves from feeling, or at least from feeling directly or with our full attention.
The Manual
I don't believe I have anything to say that isn't in the code or Manual.
In a stare
Being in a stare referred to staring fixedly and without expression at something for extensive periods of time. It can happen when you haven't had enough sleep, or too much sleep, or if you've overeaten, or are distracted, or merely daydreaming. It is not daydreaming, however, because it involved gazing at something. Staring at it. Usually straight ahead—a shelf on a bookcase, or the centerpiece on the dining room table, or your daughter or child. But in a stare, you are not really looking at this thing you are seeming to stare at, you are not even really noticing it—however, neither are you thinking of something else. You in truth are not doing anything, mentally, but you are doing it fixedly, with what appears to be intent concentration. It is as if one's concentration becomes stuck the way an auto's wheels can be stuck in the snow, turning rapidly without going forward, although it looks like intense concentration. And now I too do this.
We infantilize ourselves
Here in the US, we expect government and law to be our conscience. Our superego, you could say. It has something to do with liberal individualism, and something to do with capitalism, but I don't understand much of the theoretical aspect—what I see is what I live in. Americans are in a way crazy. We infantilize ourselves. We don't think of ourselves as citizens—parts of something larger to which we have profound responsibilities. We think of ourselves as citizens when it comes to our rights and privileges, but not our responsibilities. We abdicate our civic responsibilities to the government and expect the government, in effect, to legislate morality.
Doubling
Obetrolling didn't make me self-conscious. But it did make me much more self-aware. If I was in a room, and had taken an Obetrol or two with a glass of water and they'd taken effect, I was now not only in the room, but I was aware that I was in the room. In fact, I remember I would often think, or say to myself, quietly but very clearly, 'I am in this room.' It's difficult to explain this. At the time, I called it 'doubling', but I'm still not entirely sure what I meant by this, nor why it seemed so profound and cool to not only be in a room but be totally aware that I was in the room.
Strings and clots
The walls' texture was mostly smooth, but if you really focused your attention there were also a lot of the little embedded strings and clots which painters tend to leave when they're paid by the job and not the hour and thus have no motivation to hurry. If you really look at something, you can almost always tell what type of wage structure the person who made it was on.
More by accident
In an intentional bout of concentrated major thinking, where you sit down with the conscious intention of confronting major questions like 'Am I currently happy?' or 'What, ultimately, do I really care about and believe in?' or— particularly if some kind of authority figure has just squeezed your shoes—'Am I essentially a worthwhile, contributing type of person or a drifting, indifferent, nihilistic person?', then the questions often end up not answered but more like beaten to death, so attacked from every angle and each angle's different objections and complications that they end up even more abstract and ultimately meaningless than when you started. Nothing is achieved this way, at least that I've ever heard of. Certainly, from all evidence, St. Paul, or Martin Luther, or the authors of The Federalist Papers, or even President Reagan never changed the direction of their lives this way—it happened more by accident.
Wisdom
This remains largely theory, but my best guess as to his never dispensing wisdom like other dads is that my father understood that advice—even wise advice—actually does nothing for the advisee, changes nothing inside, and can actually cause confusion when the advisee is made to feel the wide gap between the comparative simplicity of the advice and the totally muddled complication of his own situation and path.
No-nonsense
Admittedly, though, however alert and aware I felt, I was probably more aware of the effects the lecture seemed to be having on me than of the lecture itself, much of which was over my head, and yet was almost impossible to look away from or not feel stirred by. This was partly due to the substitute's presentation, which was rapid, organized, undramatic, and dry in the way of people who know that what they are saying is too valuable in its own right to cheapen with concern about delivery or 'connecting' with the students. In other words, the presentation had a kind of zealous integrity that manifested not as style but as the lack of it. I felt that I suddenly, for the first time, understood the meaning of my father's term 'no-nonsense', and why it was a term of approval.
The pie has been made
"In today's world, boundaries are fixed, and most significant facts have been generated. Gentleman, the heroic frontier now lies in the ordering and deployment of those facts. Classification, organization, presentation. To put it another way, the pie has been made—the contest is now in the slicing."
Midwest sunset
For those who've never experienced a sunrise in the rural Midwest, it's roughly as soft and romantic as someone's abruptly hitting the lights in a dark room. This is because the land is so flat that there is nothing to impede or gradualize the sun's appearance. It's just all of a sudden there.
Test anxiety
It was part of a larger discussion about younger examiners and television and the theory that America had some vested economic interest in keeping people over-stimulated and unused to silence and single-point concentration. Shackleford's observation was that the real object of the crippling anxiety in 'test anxiety' might well be a fear of the tests' associated stillness, quiet, and lack of time for distraction. Without distraction, or even the possibility of distraction, certain types of people feel dread—and it's this dread, not so much the test itself, that people feel anxious about.
To fill in the gaps
It would be easy to impose on the office a whole welter of detail, explanation, and background that was actually gleaned only later and not part of my arrival and dazed scurrying about with the Iranian Crisis at all. Which is a quirk of temporal memory—one tends to fill in gaps with data acquired only later, sort of the same way the brain automatically works to fill in the visual gap caused by the optical cord's exit through the back of the retina.
Every love story is a ghost story
What hell is
He felt in a position to say he knew now that hell had nothing to do with fires or frozen troops. Lock a fellow in a windowless room to perform rote tasks just tricky enough to make him have to think, but still rote, tasks involving numbers connected to nothing he'd ever see or care about, a stack of tasks that never went down, and nail a clock to the wall where he can see it, and just leave the man there to his mind's own devices.
No place it hadn't already been
He imagined that the clock's second hand possessed awareness and knew that it was a second hand and that its job was to go around and around inside a circle of numbers forever at the same slow unvarying machinelike rate, going no place it hadn't already been a million times before, and imagining the second hand was so awful it made his breath catch in his throat and he looked quickly around to see if any of the examiners around him had heard it or were looking at him.
The word invents itself
Posits certain neologisms as arising from their own cultural necessity—his words, I believe. Yes, he said. When the kind of experience that you're getting a man-sized taste of becomes possible, the word invents itself.
Unborable
The underlying bureaucratic key is the ability to deal with boredom. To function effectively in an environment that precludes everything vital and human. To breathe, so to speak, without air.
The key is the ability, whether innate or conditioned, to find the other side of the rote, the picayune, the meaningless, the repetitive, the pointlessly complex. To be, in a word, unborable. I met, in the years 1984 and '85, two such men.
It is the key to modern life. If you are immune to boredom, there is literally nothing you cannot accomplish.
Institutional structure
'That was all he said it seemed like I needed, just to talk to somebody with no bullshit, which was what the Zeller Center doctors didn't realize, or like they couldn't realize it because then the whole structure would come down, that here the doctors had spent four million years in medical school and residency and the insurance companies were paying all this money for diagnosis and OT and therapy protocols, it was all an institutional structure, and once things became institutionalized then it all became this artificial, like, organism and started trying to survive and serve its own needs just like a person, only it wasn't a person, it was the opposite of a person, because there was nothing inside it except the will to survive and grow as an institution.'