It is about balancing the twin needs of writing good software, and writing any software at all.
- Mar 2021
-
blog.izs.me blog.izs.me
-
-
www.deque.com www.deque.com
-
Don’t Believe The Type!
Gareth Ford Williams, BBC
David Bailey, BBC
Bruno Maag, Typeface designer
"Emotional accessibility"
- Is it appealing? Technical and functional aspects are meaningless if no one wants to use your product/tool
- Typeface = "visual tone of voice" and has a large bearing on emotional a11y
Readability group survey
- looking at series of fonts to see which they find most readable (also had people remove reading glasses if they use them)
- cognitive bias: we might find fonts used in system UIs and commonly used fonts easier to read just because we're used to seeing them
- 2022 user sessions, every font viewed 16,800 times
- Segments for participants: confident readers, glasses for reading, pinch-to-zoom user, larger font, colored text, farsightedness, dyslexia & similar characteristics
Font selection rate: all participants
- Open dyslexic, Comic Sans, Times new Roman selected least frequently
- Helvetica, Ubuntu, Roboto slab, etc did moderately well
- SF Pr, Segoe UI, BBC Reith Sans, Verdana selected most often
- But none of the fonts scored more than 70%
- How do we know people are choosing for readability and not aesthetics? We'd probably see no difference b/t those with dyslexia and those who don't have it
Font selection rate: Dyslexic traits
- Open Dyslexic, Dyslexie, Comic Sans MS performed better among dyslexic folks but they were still selected least frequently
- Helvetica, Roboto, Segoe UI, and SF Pro selected less often (5-10%) among dyslexic people
Poor near vision group
- Times New Roman and Helvetica see largest drop
Letter combos used to find issues
- "rn"in words like kernel, furnished, surname
Why some typefaces work better than other
- Top 4 performers: San Francisco Pro, Segoe UI, Verdana, BBC Reith Sans
- All sans serif, either grotesque or humanist
- Grotesque: closed character shapes - stroke terminal loops back into character
- Humanist: open character shapes - more akin to movement of handwriting (more distinction b/t shapes like c, e, and o)
- Why does Helvetica not perform well? Probably because of tight letter spacing
- Why does Ubuntu fall short even though it has hallmarks of humanist design? Font weight is stronger than other similar fonts, maybe just outside acceptable parameters. Or maybe it looks too modern.
- Why do dyslexic-specific fonts perform poorly? The irregularity claims to be beneficial to dyslexic people but maybe is too much, affecting smoothness of reading and emotional appeal
- Why does Comic Sans perform poorly, even though it's most used font and thought to be helpful to learning readers? No data to back up this claim, but it's possible the childish appearance is more appealing to young readers. But on the other hand, it could have performed poorly because it's trendy to hate Comic Sans.
- Is there an unconscious bias toward serif designs? Reading on a computer is more commonplace, and perhaps we associate sans serif with screens and serif with print.
- Times New Roman has some characteristics of fonts that perform well, but letter spacing is tight.
- Lower-case g: modern g is not necessarily more accessible, or we'd expect Roboto to perform better
- x-height impacts perceived size, even at same font-size. Smaller x-height is perceived as "less readable"
-
-
www.ucl.ac.uk www.ucl.ac.uk
-
System architects: equivalents to architecture and planning for a world of knowledge and data Both government and business need new skills to do this work well. At present the capabilities described in this paper are divided up. Parts sit within data teams; others in knowledge management, product development, research, policy analysis or strategy teams, or in the various professions dotted around government, from economists to statisticians. In governments, for example, the main emphasis of digital teams in recent years has been very much on service design and delivery, not intelligence. This may be one reason why some aspects of government intelligence appear to have declined in recent years – notably the organisation of memory.57 What we need is a skill set analogous to architects. Good architects learn to think in multiple ways – combining engineering, aesthetics, attention to place and politics. Their work necessitates linking awareness of building materials, planning contexts, psychology and design. Architecture sits alongside urban planning which was also created as an integrative discipline, combining awareness of physical design with finance, strategy and law. So we have two very well-developed integrative skills for the material world. But there is very little comparable for the intangibles of data, knowledge and intelligence. What’s needed now is a profession with skills straddling engineering, data and social science – who are adept at understanding, designing and improving intelligent systems that are transparent and self-aware58. Some should also specialise in processes that engage stakeholders in the task of systems mapping and design, and make the most of collective intelligence. As with architecture and urban planning supply and demand need to evolve in tandem, with governments and other funders seeking to recruit ‘systems architects’ or ‘intelligence architects’ while universities put in place new courses to develop them.
-
-
github.com github.com
-
Here's the four case: foo.js Load/Require dependencies Concatenate dependencies foo.js.map Load foo.js Currently grabs metadata[:map] from asset to build an asset, need to move that generation somewhere else to accomplish de-coupling map generation foo.debug.js Load foo.js Load foo.js.map Add comment to end of foo.js with path to foo.js.map foo.source.js The raw file on disk, the map file will need to point to source files.
-
-
store.steampowered.com store.steampowered.com
-
There are myriads of platformers around, it's an oversaturated market, and just like industrial designer Karim Rashid said about there being no excuse by this point to make an uncomfortable chair, there's no excuse by this point to make a boring patformer.
-
-
css-tricks.com css-tricks.com
-
Positively indicate valid input values Let users know a field has been entered correctly. The browser can give us this information through the :valid CSS selector:
-
-
tylergaw.com tylergaw.com
-
There are plenty of words and acronyms you can put in front of “Designer”. Product, Web, Graphic, UX, UI, IA, etc. The lines between each are blurry, and the titles go in and out of fashion. Depending on the project and team I’m working alongside, I practice them all to varying degrees. I prefer to call myself; “A Designer.”
-
-
github.com github.com
-
www.kickstarter.com www.kickstarter.com
-
She asked me if I could create international universal design Shogi set for foreign Shogi fans.
-
Design SHOGI pieces have been redesigned with new iconography to indicate the piece’s movement.
-
-
medium.com medium.com
-
Rabbit, Rabbit. ‘A Game Designer’s Analysis Of QAnon’. Medium, 11 January 2021. https://medium.com/curiouserinstitute/a-game-designers-analysis-of-qanon-580972548be5.
-
-
github.com github.com
-
Uber::Option implements the pattern of taking an option, such as a proc, instance method name, or static value, and evaluate it at runtime without knowing the option's implementation.
-
-
trailblazer.to trailblazer.to
-
Instead of one big code pile, activities will gently enforce a clean, standardized way for organizing code.
-
-
trailblazer.to trailblazer.to
-
A leaked snippet of the endpoint architectural design draft document, highly confidential.
-
- Feb 2021
-
hyperallergic.com hyperallergic.com
-
The tech takeover corresponds with shrinking possibilities. This evolution has also seen the rise of a seeming aesthetic paradox. Minimalist design reigns now that the corporations have taken over the net. Long seen as anti-consumerist, Minimalism has now become a coded signal for luxury and control. The less control we have over our virtual spaces, the less time we spend considering our relationships with them.
Interessante laatste zin. Hoe minder we eigen controle hebben, zeggenschap, agency, hoe minder we ons bezighouden met de aard van de relatie. Die relatie kan verschillende vormen hebben.
-
-
design-justice.pubpub.org design-justice.pubpub.org
-
What is the relationship between design, power, and social justice? “Design justice” is an approach to design that is led by marginalized communities and that aims explicitly to challenge, rather than reproduce, structural inequalities. It has emerged from a growing community of designers in various fields who work closely with social movements and community-based organizations around the world.
Alles wat niet wordt gedisciplineerd en gestructureerd door natuurwetenschappelijke wetmatigheden hangt samen met de menselijke creativiteit en behoeften. Van de inrichting van steden tot de inrichting van de maatschappij hebben we te maken met het ontwerpactiviteiten. De relatie tussen die inrichting en het gedrag van gebruikers waarvoor die inrichting is bedoeld is een vrij complexe. Of zoals Churchill het eens (1943) verwoordde:
“We shape our buildings, thereafter they shape us.”
Niet veel later (1967) werd een vergelijkbare uitspraak (ten onrechte) toegeschreven aan McLuhan:
"We shape our tools, and thereafter our tools shape us."
Degene die deze uitspraak deed, John Culkin, illusteerde dit aan de hand van de intrede van de auto
Once we have created a car, for example, our society evolves to make the car normal, and our behavior adapts to accommodate this new normal.
De wederkerige invloed (performativiteit) van al hetgeen de mens creëert (uiteenlopend van gebouwen en apparaten tot 'simme steden' en algoritmes) is een belangrijk om te begrijpen dat een ontwerp meer is dan kenmerk dat het gebruik bevorderd. Ontwerpkenmerken hebben blijkbaar wederkerig effect op het menselijk gedrag. Ze zetten niet alleen aan tot gedrag dat is bedoeld en wordt getriggerd door de affordances van het ontwerp: unieke relatie tussen de kenmerken van een ‘ding’ in samenhang met een gebruiker die beïnvloedt hoe dat ding wordt gebruikt. Een relatie die verder gaat dan een eenzijdige perception-action coupling.
Met betrekking tot sociale media kunnen we bijvoorbeeld spreken van 'transactional media effects':
"... outcomes of media use also influence media use. Transactional media-effects models consider media use and media effects as parts of a reciprocal over-time influence process, in which the media effect is also the cause of its change (Früh & Schönbach, 1982)."
Het gegeven dat ontwerpers vaak alleen de positieve ervaring van gebruikers voor ogen hebben is volgens Danah Abdulla niet constructief.
"...optimism in design is not always constructive. In fact, it hinders the politicization of designers. If design is going to contribute to tools that can change the world positively, it must begin to embrace pessimism."
-
-
publicstack.net publicstack.net
Tags
Annotators
URL
-
-
github.com github.com
-
Version HEAD now
Tags
Annotators
URL
-
-
github.com github.com
-
now that I realize how easy it is to just manually include this in my app: <%= javascript_include_tag 'xray', nonce: true if Rails.env.development? %> I regret even wasting my time getting it to automatically look for and add a nonce to the auto-injected xray.js script
Tags
- removing legacy/deprecated things
- removing feature that is more trouble than it's worth (not worth the effort to continue to maintain / fix bugs caused by keeping it)
- removing features to simplify implementation
- regret
- wasted effort
- fix design/API mistakes as early as you can (since it will be more difficult to correct it and make a breaking change later)
Annotators
URL
-
-
-
Witte, E. H., Stanciu, A., & Zenker, F. (2020, October 28). A simple measure for the empirical adequacy of a theoretical construct. https://doi.org/10.31234/osf.io/gdm
-
-
edtechbooks.org edtechbooks.org
-
A learning design is a creative pathway, with steps along the way, that guides someone from a point of introduction to a permanent change in knowing, doing, or being.
This is a really interesting definition that I will be chewing on.
Tags
Annotators
URL
-
-
github.com github.com
-
but if you were previously using regexp or proc values, they won't work at all with Sprockets 4, and if you try you'll get an exception raised that looks like NoMethodError: undefined method 'start_with?'
-
-
www.schneems.com www.schneems.com
-
When Sprockets was introduced, one of the opinions that it held strongly, is that assets such as CSS and JS should be bundled together and served in one file.
-
-
-
But so far everything brought up has just been about the relative advantages of checked exceptions, and that issue is closed. We won't do it.
-
-
en.wikipedia.org en.wikipedia.org
-
Each of the programming language generations aims to provide a higher level of abstraction of the internal computer hardware details, making the language more programmer-friendly, powerful, and versatile.
-
-
trailblazer.to trailblazer.to
-
provide interfaces so you don’t have to think about them
Question to myself: Is not having to think about it actually a good goal to have? Is it at odds with making intentional/well-considered decisions?  Obviously there are still many of interesting decisions to make even when using a framework that provides conventions and standardization and makes some decisions for you...
-
Trailblazer is an architectural pattern that comes with Ruby libraries to implement that pattern.
-
-
trailblazer.to trailblazer.to
-
The adapter is where authentication, policy checks, and eventually your domain logic happen. All termini of the protocol’s activity are standardized end events - that’s how protocol and adapter communicate.
-
-
github.com github.com
-
Trailblazer offers you a new, more intuitive file layout in applications.
-
Instead of grouping by technology, classes and views are structured by concept, and then by technology. A concept can relate to a model, or can be a completely abstract concern such as invoicing.
-
Concepts over Technology
-
While Trailblazer offers you abstraction layers for all aspects of Ruby On Rails, it does not missionize you. Wherever you want, you may fall back to the "Rails Way" with fat models, monolithic controllers, global helpers, etc. This is not a bad thing, but allows you to step-wise introduce Trailblazer's encapsulation in your app without having to rewrite it.
Tags
- freedom of user to override specific decision of an authority/vendor (software)
- rails: the Rails way
- leaving the details of implementation/integration up to you
- focus on what it should do, not on how it should do it (implementation details; software design)
- abstractions
- software development: organization of files: by component rather than by file type
- making changes / switching/migrating gradually/incrementally/step-wise/iteratively
- newer/better ways of doing things
- allowing developer/user to pick and choose which pieces to use (allowing use with competing libraries; not being too opinionated; not forcing recommended way on you)
- focus on concepts/design/structure instead of specific/concrete technology/implementation
- software development: organization of files
- Trailblazer
Annotators
URL
-
-
trailblazer.to trailblazer.to
-
The new 2.1 version comes with a few necessary but reasonable changes in method signatures. As painful as that might sound to your Rails-spoiled ears, we preferred to fix design mistakes now before dragging them on forever.
-
The new call API is much more consistent and takes away another thing we kept explaining to new users - an indicator for a flawed API.
Tags
- if it's incorrect; fix it
- do it right/well the first time because it may be too hard to clean up/fix later if you don't
- fix design/API mistakes as early as you can (since it will be more difficult to correct it and make a breaking change later)
- learn from your mistakes
- better late than never
- pointing out gaps/downsides/cons in competition/alternatives
Annotators
URL
-
-
psyarxiv.com psyarxiv.com
-
Anderson, Ian, and Wendy Wood. ‘Habits and the Electronic Herd: The Psychology behind Social Media’s Successes and Failures’. PsyArXiv, 23 November 2020. https://doi.org/10.31234/osf.io/p2yb7.
-
-
creativegood.com creativegood.com
-
But what if leadership not only ignores our recommendations but tells us to do something different? I'll never forget one comment. "We're lying to our users," one anguished UX designer told me, explaining that leadership regularly ordered the UX team to create designs that were intentionally misleading. Apparently it helped boost profits.
-
-
en.wikipedia.org en.wikipedia.org
-
I think a better, more immediately understandable name for this concept would be command object, because it lets you pass around commands (or a list of commands) as objects.
That's the only thing you really need to know abut this pattern. The rest seems like boring implementation details that aren't that important, and that naturally follow from the primary definition above.
-
-
en.wikipedia.org en.wikipedia.org
-
In programming language design, a first-class citizen (also type, object, entity, or value) in a given programming language is an entity which supports all the operations generally available to other entities. These operations typically include being passed as an argument, returned from a function, modified, and assigned to a variable.
-
-
github.com github.com
-
Set your models free from the accepts_nested_attributes_for helper. Action Form provides an object-oriented approach to represent your forms by building a form object, rather than relying on Active Record internals for doing this.
It seems that the primary/only goal/purpose was to provide a better alternative to ActiveRecord's accepts_nested_attributes_for.
Unfortunately, this appears to be abandoned.
-
-
en.wikipedia.org en.wikipedia.org
-
In object-oriented programming, information hiding (by way of nesting of types) reduces software development risk by shifting the code's dependency on an uncertain implementation (design decision) onto a well-defined interface. Clients of the interface perform operations purely through it so if the implementation changes, the clients do not have to change.
-
-
www.infoworld.com www.infoworld.com
-
-
This column and last month's article are about design. Design, by nature, is a series of trade-offs. Every choice has a good and bad side, and you make your choice in the context of overall criteria defined by necessity. Good and bad are not absolutes, however. A good decision in one context might be bad in another.
-
By the same token, marketing or political incentives often push design idioms
Tags
- design idioms
- software design
- doing things for business/marketing/political reasons/incentives
- getters/setters
- doing things for the wrong reasons
- design is about trade-offs
- dichotomous thinking
- excellent technical writing
- relativeness
- to read
- software design patterns
- progress requires compromises
Annotators
URL
-
-
www.javaworld.com www.javaworld.com
-
Programming to interfaces is at the core of flexible structure.
-
many successful projects have proven that you can develop high-quality code more rapidly (and cost effectively) this way than with the traditional pipelined approach
-
-
softwareengineering.stackexchange.com softwareengineering.stackexchange.com
-
The more important point comes from a program design perspective. Here, "programming to an interface" means focusing your design on what the code is doing, not how it does it. This is a vital distinction that pushes your design towards correctness and flexibility.
-
-
-
The reason Reform does updating attributes and validation in the same step is because I wanna reduce public methods. This is to save users from having to remember state.
I see what he means, but what would you call this (tag)? "have to remember state"? maybe "have to remember" is close enough
Or maybe order is important / do things in the right order is all we need to describe the problem/need.
-
-
en.wikipedia.org en.wikipedia.org
-
github.com github.com
-
Top level architecture
-
-
-
www.cise.ufl.edu www.cise.ufl.edu
-
The basic idea of this pattern is much like the idea of an assembly line
-
-
psyarxiv.com psyarxiv.com
-
Lakens, D. (2021). Sample Size Justification. PsyArXiv. https://doi.org/10.31234/osf.io/9d3yf
-
-
blog.joinmastodon.org blog.joinmastodon.org
-
The Webfinger endpoint is always under /.well-known/webfinger, and it receives queries such as /.well-known/webfinger?resource=acct:bob@my-example.com. Well, in our case we can cheat, and just make it a static file:
Another anti-endorsement for protocols that require this level of power.
-
-
www.sciencedirect.com www.sciencedirect.com
-
Verani, J. R., Baqui, A. H., Broome, C. V., Cherian, T., Cohen, C., Farrar, J. L., Feikin, D. R., Groome, M. J., Hajjeh, R. A., Johnson, H. L., Madhi, S. A., Mulholland, K., O’Brien, K. L., Parashar, U. D., Patel, M. M., Rodrigues, L. C., Santosham, M., Scott, J. A., Smith, P. G., … Zell, E. R. (2017). Case-control vaccine effectiveness studies: Preparation, design, and enrollment of cases and controls. Vaccine, 35(25), 3295–3302. https://doi.org/10.1016/j.vaccine.2017.04.037
-
-
www.quirksmode.org www.quirksmode.org
-
Überblick tut Geschichte und den wichtigsten Texten zu Progressive. Enhancement. Tolle Links!
-
-
www.codewall.co.uk www.codewall.co.uk
-
Using details/summary for dropdown nav menu without requiring any JavaScript
-
in this post, we’ll look at how to use this as the basis for an accessible dropdown navigation element that can be opened equally well by keyboard users tabbing through the page, and mouse users hovering on the nav item
-
-
www.erudit.org www.erudit.org
-
les objectifs à atteindre ne sont pas codés au départ
Ouverture des objectifs, en renversement direct de la conception inversée si chère à l'ingénierie pédagogique. Les résultats d'apprentissage ne sont pas dans une relation de causalité linéaire avec les objectifs d'apprentissages.
-
-
blog.enkerli.com blog.enkerli.com
-
Worked
One of my early prototyping experiences in the OER field.
-
-
github.com github.com
-
This idea is not new, there are reference books which teach the use of grid layout, I haven't seen a single book that doesn't show a grid overlay as part of the process.
-
a designer / developer / designoper is able to create a grid overlay which would act as design reference.
-
-
stackoverflow.com stackoverflow.com
-
never care and try to understand design standards
-
- Jan 2021
-
unix.stackexchange.com unix.stackexchange.com
-
that's by design:
Can't upgrade from EOL version
Supposed to upgrade from it while it is still supported...
I can see calling this upgrade path "unsupported", but isn't "by design" going a bit too far?
It seems like it's not so much an intentional design choice to disallow it as it is an inadvertent side effect of ending support for it, and of only developing support for specific version upgrade paths.
-
-
github.com github.com
-
The code is far simpler and easier to understand/verify
-
-
stackoverflow.com stackoverflow.com
-
stackoverflow.com stackoverflow.com
-
This is responsive, but you can use media queries to specify different sizes and margins for mobile if necessary.
-
-
pubs.rsc.org pubs.rsc.org
-
Postsecondary chemistry curricula and universal design for learning: planning for variations in learners’ abilities, needs, and interests
Evaluates CLUE, Mastering-SP, and POGIL curricula on universal design for learning checkpoints for making materials accessible for students with disabilities Guidelines for universal design for learning valuable for course design
-
-
-
css-tricks.com css-tricks.com
-
I used it to create a full-bleed utility class: .full-bleed { width: 100vw; margin-left: calc(50% - 50vw); }
-
-
stackoverflow.com stackoverflow.com
-
en.wikipedia.org en.wikipedia.org
-
www.dezeen.com www.dezeen.com
-
An absolute passion - retail architecture - check out this exquisite fitout.
-
-
www.dunedin.govt.nz www.dunedin.govt.nz
-
It will be interesting to see what the details are for these rule changes - exciting to see the DCC gearing up for growth in our wonderful city.
-
-
hypothes.is hypothes.is
-
I came across this article about the tension between computer drawing and hand drawing in architecture when I replied to an annotation by another user @onion - very interesting read and I would be curious to see this issue revisited in another ten years...how may opinions have changed?
-
-
-
Join Our Community
-
-
forums.theregister.com forums.theregister.com
-
By design, snap apps have no access to /etc. They live in their own little world, but instead of a normal chroot, they are splatted all over the standard Linux filesystem layout. With other bits mounted hither and thither. Its a mess, and subject to change with each release.
-
The past few years seems to have be a race between Microsoft and various players in the Linux world to see who can produce the worst abomination of a UI. It's as if there's been a ritualistic burning of the UI design rule book that led to many years of largely stable and consistent user experience across all platforms
-
-
2x4.org 2x4.org
-
The span of graphic design is not a history of concepts but of forms.
-
he meant that the designer’s purview is to shape, not to write. But that shaping itself is a profoundly affecting form.
-
Paul Rand wrote “There is no such thing as bad content, only bad form,”
-
The apotheosis of this notion, repeated ad nauseum (still!), is Beatrice Warde’s famous Crystal Goblet metaphor, which asserts that design (the glass) should be a transparent vessel for content (the wine).
-
Designers also trade in storytelling. The elements we must master are not the content narratives but the devices of the telling: typography, line, form, color, contrast, scale, weight. We speak through our assignment, literally between the lines.
We tell stories not through words, but through our portrayal of them: visuals.
-
-
blog.imagerelay.com blog.imagerelay.com
-
going back to find something they found before
-
-
freefrontend.com freefrontend.com
Tags
Annotators
URL
-
-
www.material.io www.material.io
-
The rail is a side navigation component that displays three to seven app destinations
-
-
framework7.io framework7.io
-
Open About Popover
I have to say, I like how it looks in their Apple and Desktop preview better than the Android/Material preview. I wish they had the arrow in Android Material too.
But on https://sveltematerialui.com/demo/menu-surface it doesn't bother me quite as much...
-
-
medium.com medium.com
-
In my opinion, it can sometimes look odd. Very interestingly, this is by design and is part of the Material design specification. This article isn’t to argue whether it should be this way or not, though; it’s just to change yours such that your MenuItem(s) show below the menu selection, like so:
-
-
pixinvent.com pixinvent.com
-
Material is the metaphor The metaphor of material defines the relationship between space and motion. The idea is that the technology is inspired by paper and ink and is utilized to facilitate creativity and innovation. Surfaces and edges provide familiar visual cues that allow users to quickly understand the technology beyond the physical world.
-
-
material.io material.ioMenus1
-
By default, menus open with an entrance animation. However, on desktop, menus can skip the animation and open instantly instead.
Why only on desktop? That delay drives me crazy. I would like to skip on web/mobile too.
-
-
-
A notable difference between OS dialogs and Material dialogs is that OS dialogs save the work when a user dismisses a dialog but Material dialogs don’t.
-
-
internals.rust-lang.org internals.rust-lang.org
-
ux.stackexchange.com ux.stackexchange.com
-
Material Design guidelines don't specify popovers, but the specification of material properties provide a clear set of properties that can be used to create popups.
-
Material cannot occupy the same plane. But material can be stacked.
-
-
alistapart.com alistapart.com
-
material.io material.io
-
Small components can set the size of their corner shape using a percentage of the absolute height of the component. This means the corner shape will change as the component height changes.
-
-
material.io material.ioButtons5
-
Outlined buttons are also a lower emphasis alternative to contained buttons, or a higher emphasis alternative to text buttons.
-
Dialogs use text buttons because the absence of a container helps unify the action with the dialog text. Align text buttons to the right edge for left-to-right scripts.
-
Text buttons are often embedded in contained components like cards and dialogs, in order to relate themselves to the component in which they appear. Because text buttons don’t have a container, they don’t distract from nearby content.
-
Don'tAvoid using two contained buttons next to one another if they don’t have the same fill color.
Interesting. Do I agree with this?
What is the reason they recommend this? It looks fine to me...
At least they give alternatives that they recommend...
-
-
-
material-ui.com material-ui.com
Tags
Annotators
URL
-
-
material-ui.com material-ui.com
-
inclusivedesignprinciples.org inclusivedesignprinciples.org
Tags
Annotators
URL
-
- Dec 2020
-
material.io material.ioDividers1
-
material.io material.io
-
medium.com medium.com
-
getmdl.io getmdl.io
-
www.bio-rad.com www.bio-rad.com
-
We recommend the following changes to the default settings when designing ddPCR assays:
Primer3 : designing primers and probes for ddPCR
In the General Settings window, change “Concentration of divalent cations” to 3.8, “Concentration of dNTPs” to 0.8, and “Mispriming/Repeat Library” to the correct organism ■In the Advanced Settings window, change both the “Table of thermodynamic parameters” and “Salt correction formula” to SantaLucia 1998 ■In the Internal Oligo window, we recommend setting 15 for the minimum number of bases for the oligo. We recommend 64°C as the minimum Tm for the probe, 65°C as the optimal Tm for the probe, and 70°C as the maximum Tm for the probe. These parameters can be relaxed to allow for smaller/larger oligos, which may be necessary for high GC or low GC targets. Oligo size should be no smaller than 13 and no larger than 30 nucleotides
Note: After you have made the desired changes in Primer3Plus, select Save Settings under General Settings and save these parameters in a file. To apply these settings in the future, upload them by selecting Browse in the General Settings tab, find this file, and click Activate Settings.
-
Strive for a Tm between 50 and 65°C. One way to calculate Tm values is by using the nearest-neighbor method. Use the Tm calculator at http://www.basic.northwestern.edu/biotools/oligocalc.html, with values of 50 mM for salt concentration and 300 nM for oligonucleotide concentration
-
-
www.lafabriquedunet.fr www.lafabriquedunet.fr
-
ngr.coar-repositories.org ngr.coar-repositories.org
Tags
Annotators
URL
-
-
news.rice.edu news.rice.edu
-
has developed novel bioinformatics software called OliVar, which allows researchers and assay developers to automate and design assays that target regions of the virus genome that have the lowest frequency of mutation
-
-
github.com github.com
-
this second approach, while more verbose, sort of spells out better where things are coming from. (I like it, in other words.)
-
-
sapper.svelte.dev sapper.svelte.dev
-
page is a { host, path, params, query } object where host is the URL's host, path is its pathname, params is derived from path and the route filename, and query is an object of values in the query string.
I like that we don't have to manually parse params/query out of the full request URI. It provides the data that you are most likely to need, in an readily/easily-usable form.
Tags
Annotators
URL
-
-
www.theatlantic.com www.theatlantic.com
-
Facebook’s stated mission—to make the world more open and connected—
If they were truly serious about the connectedness part, they would implement the Webmention spec and microformats, or something just like it, but open and standardized.
-
-
www.youtube.com www.youtube.com
-
What the #$%@ is UX Design?
Short video about User Experience Design.
Tags
Annotators
URL
-
-
github.com github.com
-
Some of these are absent-by-design
-
-
-
The best solution that I found while trying to build a masonry component was to package up a pair of components and place child components inside a wrapper - I chose CardLayout and Card such that users would write something like: <CardLayout> <Card><MyBeautifulCard /></Card> <Card><AnotherCard /></Card> </CardLayout>
-
Hm, React-way is really hacky... When we talking about lists, masonry, or any other table-style components, first of all, we talk about arrays and iteration through them. If you iterate over the children in the Masonry component, somewhere (in parent component I guess) you also iterate over the actual items. Over and over again, in all places you use this component, you perform almost the same iteration twice. Why we should do this? I believe the interface of this kind of components should look like this: <Masonry {items} {colsNum} let:item> <SomeItemComponent>{item}</SomeItemComponent> </Masonry>
-
<script> export let items = []; export let colsNum = 3; $: cols = items.reduce(...); </script> {#each cols as col} {#each col as item} <slot {item} /> {/each} {/each}
Tags
Annotators
URL
-
-
-
For a long time, the blue flame coming out of a gas burner has evoked cleanliness. That was no accident, but the result of a concerted advertising campaign.
design gone wrong
-
-
github.com github.com
-
I think the main difference between the two are the way API are served. Some smelte components need you to input big chunk of json as props, while i prefer keep props as primitive types and in the other hand give you different components tags to compose.
-
-
-
Sometimes, systems just scale the problemA UI design system is more than the code of a component library. It’s more than the colors, styles, and margins of your elements. It’s an ever-growing and ever-evolving creature that entails your brand and your user’s feelings.
If you don't understand the problem - you can [[scale the problem instead of solve the problem]], and it's important to remember that a [[design system is more than a component library]]
-
-
blog.bitsrc.io blog.bitsrc.io
-
Instead of publishing a single one-size-fits package for components, we create an ecosystem where everyone works together yet deliver independently. The design system’s team role is to facilitate and regulate, not block or enforce.
I think this is a really important point - the design system's team is to facilitate, not gatekeep.
-
What you see here is a page composed of shared components. However, these are independent components developed and owned by different teams and published from different projects, which are mixed and integrated together.
the move towards single page applications, component centric frameworks, etc has shifted how we view building webpages.
It is not so much that we are building a page, but we are building components that we assemble into a page.
We’re not designing pages, we’re designing systems of components.—Stephen Hay via atomic design
-
The design of your system is not ready until you have two assets:a) A style-guide that defines the styling and implementation of your UI. This is usually a rather long document with a lot of text and typography.b) A set of reusable visual elements that bring together both visual (UI) and functional (UX) consistency through components. This is usually a rather large canvas with elements drawn on Figma or Sketch etc (we use both).
there are two [[primary assets of a design system[[
- the style guide
- the reusable elements - an implementation of the style guide
-
The benefits of our system go way beyond UI/UX consistency. We greatly accelerated and scaled our development, improved our product quality, and greatly improved work between developers, designers, and everyone else.
Design systems enable faster development and delivery, and help teams scale - and have value beyond UI/UX consistency.
-
- Nov 2020
-
developer.mozilla.org developer.mozilla.org
-
The syntax of the fallback, like that of custom properties, allows commas. For example, var(--foo, red, blue) defines a fallback of red, blue — anything between the first comma and the end of the function is considered a fallback value.
-
-
uxdesign.cc uxdesign.cc
-
I love the Material Design System’s buttons just because their principles are really well thought through.
-
Generally speaking, one will use smaller or less prominent buttons style for this.
-
-
github.com github.com
-
I open this issue to announce that i'm actively working on a rewrite of this library to accomplish these goals:
-
-
motion-software.com motion-software.com
-
Before showing the final result of the .svelte components we will also add Material-UI, using the adapted version.
-
-
www.nature.com www.nature.com
-
Curcumin, but not fish oil, reduces postprandial glycaemic response and insulin demand for glucose control.
This backs up the two studies on fasting glucose in diabetes and per-diabetes. It is also a higher quality study (crossover design).
-
-
material.io material.ioRally2
-
Overshoot is used on important dialogs to convey a sense of urgency.
-
-
-
material.io material.ioReply2
-
-
To ensure there is enough space for both content and navigation, Reply uses different navigation patterns for desktop, tablet, and mobile.
-
-
material.io material.io
-
Material is an adaptable system of guidelines, components, and tools that support the best practices of user interface design
-
-
developer.mozilla.org developer.mozilla.org
-
cs3mesh4eosc.eu cs3mesh4eosc.eu
Tags
Annotators
URL
-
-
inveniosoftware.org inveniosoftware.org
Tags
Annotators
URL
-
-
blogs.oracle.com blogs.oracle.com
-
kentbeck,
-
-
dzone.com dzone.com
Tags
Annotators
URL
-
-
imfeld.dev imfeld.dev
-
We don't use "attribute directives" much which makes things easier.
-
-
weblog.tetradian.com weblog.tetradian.com
-
because we still remember the quality of service that the restaurant gave us.
This is pretty much what Service Design, (Digital) Product Design and User Experience Design professionals are (or at least should be) concerned about.
-
-
stackoverflow.com stackoverflow.com
-
What a very strange design decision - to treat the files as the same.
-
-
github.com github.com
-
Or even keep as is, the simplicity of this feels right in line with svelte's simplicity :)
-
-
hub.cards hub.cards
-
hub.cards allows you to create and design your next modern business card for free. Our newly developed editor is like no other on the web and makes all your creative dreams come true. If you're not a creative genius, you can choose from thousands of templates to create an appealing card.
Best free editor for creating business cards. Digital & physical ones.
-
- Oct 2020
-
indianexpress.com indianexpress.com
-
BTech in design engineering or BTech engineering design: Design thinking is a popular concept that spans multiple industries and there are courses, independent of any branch purely focussing on designing products. This is also often referred to as an engineering design course or design engineering course. The idea is to teach how to not just bring in design to develop great products that are aesthetically perfect and ergonomically usable and consumer-focused but also to introduce design as a tool for innovative thinking. The curriculum develops design thinking concepts in a manner basis which students can conceptualise and develop products that are innovative while also boasting of high aesthetic value. These graduates are sought after by all manufacturing industries.
Design thinking fosters innovative thinking.
It involes designing user focused, highly utilitarian and aesthetic products.
-
-
www.basefactor.com www.basefactor.com
-
If you want to implement a form with a superb User Experience, you have to take care of many variables:
Tags
- easy to get wrong
- too hard/difficult/much work to expect end-developers to write from scratch (need library to do it for them)
- form design
- a lot of things to consider
- user experience
- can't keep entire system in your mind at once (software development) (scope too large)
- difficult/hard problem
Annotators
URL
-
-
-
Dennis, A., Wamil, M., Kapur, S., Alberts, J., Badley, A. D., Decker, G. A., Rizza, S. A., Banerjee, R., Banerjee, A., & Investigators, O. behalf of the C. study. (2020). Multi-organ impairment in low-risk individuals with long COVID. MedRxiv, 2020.10.14.20212555. https://doi.org/10.1101/2020.10.14.20212555
-
-
learn-us-east-1-prod-fleet01-xythos.s3.amazonaws.com learn-us-east-1-prod-fleet01-xythos.s3.amazonaws.com
-
“Outdoor adult learning can be an antidote and complement to the digital world . . . offering holistic, mentally and physically challenging learning experiences.”
Adult Learning often takes place within walls or in front of a computer screen this can lead to health problems. This article offers reasons and methods for getting adults outdoors and using Universal Design. Outdoor learning can be used to complement digital learning.
-
-
github.com github.com
-
StackProf.start(mode: :cpu) StackProf.stop StackProf.results('/tmp/some.file')
Tags
Annotators
URL
-
-
-
Interaction strategies are a type of accommodation that typically go unnamed and unwritten
How many times do we use "accommodations" which dance around the relational issues, instead of dealing directly with them?
-
-
medium.com medium.com
-
However, after solving this problem a few times, a pattern appeared.
-
-
-
Typically, platform accessibility APIs do not provide a vehicle to notify assistive technologies of a role value change, and consequently, assistive technologies may not update their cache with the new role attribute value.
It's too bad they couldn't just allow role to be changed, and assistive technologies would just have to be updated to follow the suit.
-
-
drive.google.com drive.google.com
-
Good article about the importance of Universal Design when designing learning opportunities. The authors use plenty of strong sources to back their findings and keep the information concise.
9/10
-
-
-
Adult learning theories are not just a collection of jargons, concepts, and ideas about how adults learn. These theories help you plan your course during conception, development, and execution, in a way that will facilitate the learning process.
Outlines adult learning "theories": Andragogy, Transformational Learning, and Experiential Learning, and states that they are important to educational designers, but doesn't really connect them to instructional design, let alone e-design. 3/10
-
Insights 3 Adult Learning Theories Every E-Learning Designer Must Know
Adult learning theories for Instructional Designers - Article names adult learning "theories" (andragogy, neuroscience, experiential learning, SDL, and transformational learning). Discusses why these "theories" are relevant to ID. Rating 3/10
-
-
github.com github.com
-
This is basically a design goal at this point, even though it has evolved organically.
Tags
Annotators
URL
-
-
pdfs.semanticscholar.org pdfs.semanticscholar.org
-
Handbook of Research on Student-Centered Strategies in Online Adult Learning Environments
This article showcases a framework for course design using theory and research in the learning sciences. It defines student-centered learning and explains how it can/ should be used in the creation of the course and when establishing which theories and methods to structure the course around. 9/10, very detailed source.
-
-
eric.ed.gov eric.ed.gov
-
An Introduction and Guide to Enhancing Online Instruction with Web 2.0 Tools
The author provides a comprehensive overview of Web 2.0 technologies, their use in online learning recommendations, and considerations for implementation. (7/10)
-
-
elearningindustry.com elearningindustry.com
-
Instructional Design Approaches For Adult Learners
(Available as text or podcast.) This article review adult learning theory, cognitive flexibility theory and accompanying design approaches (problem-based learning, collaborative learning). While it affirms strategies, it does little to address incorporation of technology. (2/10)
-
-
www.researchgate.net www.researchgate.net
-
Blended learning: Efficient, timely and cost effective
(Click Download full-text PDF to read.) In this article, the authors discuss the blended learning instructional delivery method. Through case study, the authors demonstrate the benefits of blended course design. Furthermore, the article addresses potential detriments (financial, instructional design) of a blended course design. A brief review of considerations and recommendations for a blended design was provided. Though this article focuses on the relationship to forensic science, the information is applicable across disciplines and delivery venues (corporate, academic). (6/10)
-
-
er.educause.edu er.educause.edu
-
Considering that one of the most significant factors of online course quality is instructor presence and interpersonal interaction,4 one of the benefits video can offer is creating faculty presence in an online environment. In the interviews, students cited faculty presence as a key factor related to their engagement and perceived learning from videos. Humor and wit were described positively. Participants also mentioned the benefits of adding personable context to a subject; for instance, faculty members giving examples from their professional experiences about subject material. As one student explained, "The reading is very didactic or academic, but the videos are very real-case scenarios. The instructor narrates: 'How do you take that academic learning into the real world? What does that mean when you're looking at these financial statements?'" Another participant offered: "[The videos] are better than just reading the material because it has more of that human element."
Melanie Hibbert, the Director of Instructional Media & Technology and Media Center at Barnard College in New York City, writes about what is necessary for good online instructional videos. Hibbert discusses media at Columbia University, methods for creating videos, an what analytics tell us. She concludes by describing the importance of instructor presence more so than the production quality of videos.
Rating: 9/10
-
-
www.nhi.fhwa.dot.gov www.nhi.fhwa.dot.gov
-
Good instructional design is based on the industry-standard Instructional System Design (ISD) model. The ISD model comprises five stages—analysis, design, development, implementation, and evaluation—and is a systems approach to instructional design in that it views “human organizations and activities as systems in which inputs, outputs, processes (throughputs), and feedback and control elements are the salient features.”
This article discusses visual, auditory, and kinesthetic learning styles and the importance of communicating in ways that appeal each style. It then outlines what this means for the Instructional System Design (ISD) model. The author concludes by outlining learning outcomes, organization, interactive instruction, and content versus connection versus application. The author proposes that "good instructional design is based on the industry-standard Instructional System Design (ISD) model" (p 5).
Rating: 7/10
-
-
www.interaction-design.org www.interaction-design.org
-
Service design principles support the development of services which deliver high quality experiences to users and customers
-
Data shall be normalized between the organization and its customers and within the organization itself Data shall be easy to transfer and be reusable within the organization and within the partner network Wherever possible data entry shall be avoided and be replaced by data lookup, selection and confirmation utilities instead
-
Information flow is key to delivering high quality services; if people don’t know what they’re supposed to and when they’re supposed to know it – service suffers.
-
Work groups are to be organized so that they match the processes and the competencies required Individual workers will be given sufficient autonomy to make useful decisions Work will take place in a location where it is done with the most efficiency
Organizational Design Principles for Service Design
-
Any activity that fails to add value for the customer should be eliminated or minimized Work is always structured around processes and not around internal constructs such as functions, geography, product, etc. Work shall not be fragmented unless absolutely necessary. This enables accountability and responsibility from a single individual and reduces delays, rework, etc. It encourages creativity, innovation and ownership of work. Processes should be as simple as possible. Focus on reducing process steps, hand overs, rules and controls. Wherever possible the owner of the process should have control over how it is delivered. Processes should reflect customer needs and many versions of a process are acceptable if customers have different needs. Process variation should be kept to a minimum. Process dependencies should be kept to a minimum. (I.e. process in parallel) Processes should be internalized rather than overly decomposed (e.g. training is better than work instructions) Process breaks and delays must be kept to a minimum Reconciliation, controls and inspection of process must be kept to a minimum KPIs for processes will only measure things that matter
Process design principles for service design
-
-
www.learntechlib.org www.learntechlib.org
-
Author explores characteristics of adult learners respective to online learning environments. Andragogy is discussed as a theory, along with SDL and transformational and experiential learning. Author applies theory to design of physical environments to produce optimal circumstances for adult learning. Rating 8/10
-
-
github.com github.com
-
We aim to support all svelte features. In some cases this is not possible. For those cases we provided feasible workarounds.
-
-
facebook.github.io facebook.github.io
-
ECMAScript 6th Edition (ECMA-262) introduces template literals which are intended to be used for embedding DSL in ECMAScript.
-
-
github.com github.com
-
Deku is a library for rendering interfaces using pure functions and virtual DOM.
-
-
www.agileconnection.com www.agileconnection.com
-
In highlighting the dangers of big-up-front-design (BUFD) and waterfall development, Agilists seem to advocate no-up-front-design (NUFD) or no-up-front-requirements (NUFR) or no-up-front-architecture (NUFA).
-
-
en.wikipedia.org en.wikipedia.org
-
journals.plos.org journals.plos.org
-
Doctoral programs are often highly unstructured learning and training environments, where individual autonomy and freedom are highly valued. Decisions as to what counts as a good idea, a worthwhile project, or adequate progress are often left to the discretion of professors, and criteria for success can be opaque for students. This is even more so for those who are not already “in the know.”
-
-
dylanvann.com dylanvann.com
-
When using React hooks there is no concept of onMount because the idea of only running some code on mount leads to writing non-resilient components, components that do one thing when they mount, and then don’t take prop changes into account.
-
A component shouldn’t break because it’s rendered more or less often.
-
Keep the local state isolated.Think about which state is local to a particular UI representation — and don’t hoist that state higher than necessary.
-
Props and state can change, and components should handle those changes whenever they happen.
-
Even if a component is rendered just once, your design will improve if rendering twice doesn’t break it.
Tags
- component design: resilient components
- re-rendering
- shouldn't break it
- easy to forget
- best practices
- component design
- guidelines
- reusability
- easy mistake to make
- component design: where should this state live? where does it belong?
- software development: code organization: where does this code belong?
Annotators
URL
-
-
recoiljs.org recoiljs.org
-
We get a boilerplate-free API where shared state has the same simple get/set interface as React local state (yet can be encapsulated with reducers etc. if needed).
-
-
covid-19.iza.org covid-19.iza.org
-
COVID-19 and the Labor Market. (n.d.). IZA – Institute of Labor Economics. Retrieved October 10, 2020, from https://covid-19.iza.org/publications/dp13569/
-
-
doi.apa.org doi.apa.org
-
Long-term effectiveness of inoculation against misinformation: Three longitudinal experiments. - PsycNET. (n.d.). Retrieved October 10, 2020, from /doiLanding?doi=10.1037%2Fxap0000315
-
-
www.technologyreview.com www.technologyreview.com
-
This piece makes a fascinating point about people and interactions. It's the sort of thing that many in the design and IndieWeb communities should read and think about as they work.
I came to it via an episode of the podcast The Happiness Lab.
-
Most of the tech news we get barraged with is about algorithms, AI, robots, and self-driving cars, all of which fit this pattern. I am not saying that such developments are not efficient and convenient; this is not a judgment. I am simply noticing a pattern and wondering if, in recognizing that pattern, we might realize that it is only one trajectory of many. There are other possible roads we could be going down, and the one we’re on is not inevitable or the only one; it has been (possibly unconsciously) chosen.
-
-
www.eastgate.com www.eastgate.com
-
The path must not twist so much that visitors think they are being led astray, nor be so slow that visitors give up and strike cross-country through search engines. Nevertheless, twists and detours can help designers give their readers more than they expect.
This makes me wonder if there are interesting major features or patterns we've not created for the web in general. Upsell, crosssell, alternatives, etc... are all corporate features. What about some interesting new artistic features perhaps?
Almost no websites I run across are designed like this simple garden example. It's as if the website idea has been so rigidly crystalized that there's no room for exploration anymore.
Tags
Annotators
URL
-
-
Local file Local file
-
duty of care
This reminds me of Mike Monteiro's book Ruined by Design from last year which pushes for a code of ethics for designers.
-