[HN Gopher] Show HN: Gov.uk Vue, a Vue Component Library for the...
___________________________________________________________________
Show HN: Gov.uk Vue, a Vue Component Library for the Gov.uk Design
System
Hi HN, I've built a Vue component library based on the GOV.UK
Design System, which is used for government services in the UK. The
Design System is well-known for being accessible, well designed and
thoroughly researched, and it's been used as the basis for many
other governments' and organisations' design systems. GOV.UK Vue
includes every component in the GOV.UK Design System, with
comprehensive docs. It can also be used for projects that aren't
related to GOV.UK, as long as they don't use the GOV.UK branding
Author : matteason
Score : 109 points
Date : 2024-09-02 13:15 UTC (9 hours ago)
(HTM) web link (govukvue.org)
(TXT) w3m dump (govukvue.org)
| NtG_UK wrote:
| Impressive, but haven't we just handed crooks the perfect tool
| for crafting their next GOV.UK themed phishing site?
| matteason wrote:
| GOV.UK Frontend is already fully open source [0] with
| comprehensive documentation [1] and GDS encourage community
| contributions, libraries and resources [2]. If there was any
| worry about phishing that would be a question for GDS
|
| [0] https://github.com/alphagov/govuk-frontend
|
| [1] https://design-system.service.gov.uk/
|
| [2] https://design-system.service.gov.uk/community/resources-
| and...
| baliex wrote:
| This is impressive Matt, and I love the design system GDS has
| developed, but I'm not sure they want non-government services
| to use the system. From the second link you posted:
|
| > Use this design system to make *government* services
| consistent with GOV.UK
|
| Emphasis mine. Are GDS aware of this work? I am in no way
| affiliated with GDS by the way.
|
| --
|
| I'm always wary of this kind of thing not being on a gov.uk
| domain, which in this case is entirely appropriate because
| it's not in anyway official or endorsed by GDS. Not for any
| direct phishing/crooks concerns as raised above, but because
| it waters down the impact of this kind of thing always being
| on gov.uk domains.
|
| --
|
| Edit: I'd be _very_ surprised if GDS don't take issue with
| you having "GOV.UK" in the name given that it is no way
| associated with gov.uk
| matteason wrote:
| Non-GOV.UK services are free to use everything except the
| branding, per [0]
|
| Plenty of non-gov organisations use various bits of it, for
| example the breadcrumbs and accordion on [1]
|
| [0] https://www.gov.uk/service-manual/design/making-your-
| service...
|
| [1] https://www.rnib.org.uk/living-with-sight-
| loss/assistive-aid...
|
| Edit: Re naming - GOV.UK [Thing] is an established
| convention for community tools, as shown on [3]. GDS are
| aware of the project.
|
| [3] https://design-
| system.service.gov.uk/community/resources-and...
| baliex wrote:
| I stand corrected :)
| esquivalience wrote:
| This comment was really helpful, and addressed many of my
| instinctive reactions too.
| londons_explore wrote:
| Also, copying an html page for phishing is easy - I'm sure
| the Google/Facebook login pages have been copied by hundreds
| of people already.
|
| Phishers probably wouldn't even bother using a vue component
| - it's easier to copy the whole page from dev tools
| body.innerHTMl
| unsupp0rted wrote:
| Crooks don't need component libraries to mimic government
| websites. And their victims probably wouldn't notice one way or
| the other.
| tialaramex wrote:
| There's an old Microsoft study examining what might help
| users to not give crooks their credentials. The participants
| used their _real_ credentials to attempt a _real_ bank
| transaction, and Microsoft studied what might count as a red
| flag and stop them from attempting this transaction on a
| bogus site, variations in UI warnings, layout etc..
|
| Nothing. Nothing you could do stopped users from persisting
| in their goal, despite all the red flags, humans get stuck on
| a mission, it's called "Get-there-itis" and it kills private
| pilots, it causes those "How could you be such a moron?"
| bridge strikes you see on Youtube, it's a defect in human
| psychology, you have to design _knowing_ that this defect
| exists.
|
| So what works? Brick Wall UX. When the user _can 't_ do the
| wrong thing they won't. They'll still try of course, but now
| they can't succeed (in giving their credentials to crooks).
| mananaysiempre wrote:
| Jeff Atwood called it the dancing bunnies problem[1].
|
| [1] https://blog.codinghorror.com/the-dancing-bunnies-
| problem/
| tialaramex wrote:
| The usual term is "Dancing pigs" rather than bunnies:
| https://en.wikipedia.org/wiki/Dancing_pigs
|
| But this isn't quite the same thing, the dancing pigs (or
| bunnies) are an attraction, the mission mindset / get-
| there-itis happen after the user has decided to do
| something, and prevent them from (correctly) deciding not
| to do it in light of more information.
| dotancohen wrote:
| Just wait until you see what crooks can do with Telegram, or
| Megaupload, or the Linux kernel, or Microsoft Excel.
| globular-toast wrote:
| That's a good thing, because people need to learn how to really
| check the authenticity of a website and not base it on how it
| looks. See security by obscurity.
| samstave wrote:
| Better yet, this creates the ability for prompts such as:
|
| _" Using design system from govukvue.org create an app that
| will [check for service] from [this gov.uk url] using the same
| hooks and design components to give me a dashboard of
| [benefits] [contacts_for_benefits] [these_other-
| compnents_to_query] as a flas app and conect it to my [db] and
| give me a mobile first view - wrap it in a docker on my DO
| droplet, use the cred from the .env"_
| denysvitali wrote:
| This is impressively good - I admit that without looking at the
| URL I felt like visiting an official gov.uk website.
|
| Now, as someone else mentioned this might be a bit deceiving, so
| I wonder in what context could this be used (outside of the
| gov.uk use case). Their design system is really good, so I don't
| mind people copying it - hopefully not to the point of
| Bootstrap's websites
| matteason wrote:
| One example is the RNIB (Blindness and sight loss charity in
| the UK) - they use various bits of GOV.UK Frontend on their
| website, such as the breadcrumbs and accordion on [0]. Many
| local councils use it too (or a version of it).
|
| Because it's so heavily tested for accessibility it makes sense
| to use in those kinds of contexts where accessibility is a very
| high priority.
|
| GOV.UK Frontend can be heavily customised via Sass variables
| (eg the font stack in [1]) so the components don't have to look
| like GOV.UK if you don't want them to. GOV.UK Vue pulls all its
| styling from Frontend so it's as customisable as Frontend is.
|
| [0] https://www.rnib.org.uk/living-with-sight-loss/assistive-
| aid...
|
| [1] https://github.com/alphagov/govuk-
| frontend/blob/main/package...
| denysvitali wrote:
| Good job! I'll make sure to consider this option for my next
| Vue frontend :)
| pglevy wrote:
| The US Web Design System actually links to various
| implementations, some community-generated. It's not new to try
| to make it easier for teams to implement the system using
| various frameworks.
|
| https://designsystem.digital.gov/documentation/implementatio...
|
| Nice work, matteason!
| nemesis17 wrote:
| Happy to see this! Very neat! On my last gig, I was one of the
| contributors for the govuk components using playframework/twirl:
| https://github.com/hmrc/play-frontend-hmrc.
| manuelleduc wrote:
| Very interesting. France government is providing a design system
| as well https://www.systeme-de-design.gouv.fr/ A Vue
| impementation is available too https://vue-ds.fr/
| londons_explore wrote:
| How does performance compare? Can one still get it to load in 100
| milliseconds on a typical broadband connection? (Enough to feel
| instant)
| rmason wrote:
| I've been involved with the open data movement here in Michigan
| for a dozen years. A lot of us have been inspired by what
| happened in Britain in 2010 when a change in government allowed
| them to reimagine Britain's digital footprint.
|
| Here's a video by their chief architect detailing the changes.
|
| https://www.youtube.com/watch?v=yvB6BqYs2T0
|
| I know there's an O'Reilly video about this guy's boss but I
| can't find it. Sadly another government change was to end all
| this development. But in the end near as i can figure though a
| lot of the bosses left the changes have continued but at a slower
| rate.
|
| No government website in America begins to compare to the
| clearness and simplicity that exists in Britain nearly a dozen
| years later.
| vegancap wrote:
| I'm rarely super proud of our gov, but my god their digital team
| are killing it, and have been for some years
| pcrh wrote:
| Gov.uk is well known for its successful design. Does anyone know
| of a source that discusses why the design is/was so well designed
| and implemented? And did anyone get a knighthood out of it?
| epolanski wrote:
| I sometimes read the GitHub issues, lots to learn.
___________________________________________________________________
(page generated 2024-09-02 23:00 UTC)