228 private links
I’ve said it before and I’ll say it again: design is deciding. The best designers are the best deciders.
the important work is making the decision and moving on to the next stage. If the actual outputs at each stage are mediocre, that seems to be okay, as long as they’re just good enough to inform a go/no-go decision.
and a testimony from an experienced designer without experience with Figma.
Breadcrumbs are no longer useful because websites are not rigit and hierarchical structures anymore. They focus on retrospective (where the user was) instead of the modern concept of user journey, which is increasingly about anticipation and contextual navigation.
On mobile-first design, breadcrumbs seems redundant.
The industry is moving toward adaptive design solutions:
- contextual, dynamic navigation
- search-centric interfaces
- ai-powered navigation systems (what is the solution then?)
- minimalist design with intuitive navigation
Add direct content with designMode = 'on'
More than flat design, we can built richer interfaces.
Figma is not a platform but a tool,
From a designer that ask for help. They design their prototypes on Figma.
I am a digital designer and artist that likes things that are cool.
The list of features:
- auto field-sizing
- container queries
<dialog>
- exclusive accordions
:focus-visible
:has
hidden=until-found
- high-definition colors
<hr>
in select- inputmode
min()
,max()
,clamp()
- relative colors
- responsive videos
- scroll behavior
- scroll snap
text-wrap: balance
:user-valid
and:user-invalid
- View Transitions API
Design systems are extremely powerful when it comes to quickly creating prototypes.
- 3D flow diagram for relationships and connections
- Card Diagram to highlight and select information or data in relation to its surrounding data and information
- Pyramid graph: Being great at showing two categories of information and comparing them horizontally, they are an alternative to typical horizontal or vertical bar graphs.
Pyramid graph - Sankey Flow Diagram: show the progression and the journey of information and data and how they are connected in relation to their data value.
- Stream graph: a great way to show the data and how it relates to the other data
- Tree map: It’s a great way to show the data spatially and how the data value relates, in terms of size, to the rest of the data.
- Waterfall chart: showing the data and how it relates in a vertical manner to the range of data values.
- Doughnut chart: show the data against the other data segments, and value within a range of data.
- Lollipop chart: excellent method to demonstrate percentage values that also integrates the label and data value well.
- Bubble Chart: illustrate data values in terms of size and sub-classification in relation to the surrounding data.
Start with the first chapter Foundations
Build HTML first, then CSS, then JS.
Building your service using progressive enhancement will:
- ensure your service is robust and of a high quality
- make it more likely your service will work regardless of which browser or device is being used
- mean your service’s most basic functionality will work and meet the core needs of the user
- improve accessibility by encouraging best practices like writing semantic markup help users with device or connectivity limitations to use your service
and arguments against SPA.
Using Escape has some limitations:
- it stops the browser from loading pages
- Escaping performs other functions in the operating system
- Pressing Escape isn’t considered a user interaction:
And Esc is the only keyboard key that doesn’t count as user interaction for the purposes of transient activation.
Why other alternative keys (^ Ctrl, ⎇ Alt, ⌥ Option, ) are not better, because they have tradeoffs.
⇧ Shift is also better. It has also limitations though.
About the EtP pattern what is the EtP pattern?
We would’ve also liked to have had the button overwrite or erase the user’s recent browser history, but we can’t do that either. (And for good reason!)
Why redirect the user to BBC weather?
As civil servants, we didn’t want to link to a news service as that could lead to claims of political bias.
BBC Weather’s homepage is a content-rich page. Users have a reason to be looking at it and to be looking for an extended period of time.
Give users a way to quickly and safely exit a service, website or application.
An example of safety content page that describes how the user can be safe online: Ways to stay safe online.
An example on domestic abuse report but notice they use the Escape key.
Let's call it the EtP pattern.
(via the blog post https://beeps.website/blog/2024-10-09-why-govuk-exit-this-page-doesnt-use-escape/)
Using monospace fonts to design based on the ch unit.
Background: https://wickstrom.tech/2024-09-26-how-i-built-the-monospace-web.html