Create and Organize Figma design system and working files - Githubissues

cisagov / manage.get.gov

A Django-based domain name registrar used by the .gov domain to communicate with an EPP registry

https://get.gov

Other

57 stars 17 forks source link

Create and Organize Figma design system and working files #2583

Closed AnnaGingle closed 4 days ago

AnnaGingle commented 1 month ago

Issue description

Establish goals, align with the team on design system improvements and new processes.

Acceptance criteria

[x] Align with design team on goals and progress
[x] Create and organize a stand alone design system from working Figma files. Create new tickets are needed.
[x] Organize the designs for manage.get.gov and get.gov. Create new tickets as needed
[x] List any issues created as apart of this work below.

Additional context

The Figma file is out of date and doesn't always match what's in production. This leads to doubled efforts when designers have to make updates to a screen that hasn't been kept up to date in Figma. The Figma should have parity with what's in production so devs and designers know that the Figma is correct and can be trusted.

Links to other issues

Plan for design system improvements #2584
Figma component audit: manage.get.gov #2582
Figma component audit: get.gov #2585

Links to files:

joet333 commented 1 month ago

Starting to work on general roadmap/overview (WIP) and creating doc for audit (WIP). Adding links to both in the story itself.

joet333 commented 3 weeks ago

Testing component transfer with @AnnaGingle. Still working on best ways and what we want to do exactly. Shared out that things might be a little "funky" while we organize.

joet333 commented 2 weeks ago

Have meeting with @AnnaGingle to start moving and organizing files on Friday.

joet333 commented 2 weeks ago

@Katherine-Osos moved to this sprint since we are going to be working on organizing some things on Friday and we had some discussions today around organization ideas.

joet333 commented 2 weeks ago

Updated to include links to main audit stories (and component updates stories)

joet333 commented 2 weeks ago

@Katherine-Osos @AnnaGingle I updated this ticket to be more reflective of the next steps. I will also create another ticket for "Prioritizing component updates" please let me know if you have any questions.

Plan updated on this Miro board page

joet333 commented 1 week ago

I took advantage of you all being on holiday to transfer components from our working Figma file .gov Design CISA (working file) to our new .Gov Design System (design library) Figma file and for the most part it went pretty smoothly.

Component Transfer: All components have been moved to the new design library. I triple-checked that all links remained intact.
Org Model Components: I have left these in the working file, but they likely can be moved soon.
Prototypes: Please double-check your prototypes to ensure all selectable spots are still working.
Pagination Issues: I had to manually redo many pagination instances and updated variations.
Naming & Organization: Still in progress for the design library, but the remaining updates should be minor.
Separation of Files: The get.gov base files are now separated from the working files.
Emoji Update: Emojis on titles of the working files have been reduced to help with cognitive overload.
If you notice anything off, let me know, and I’ll fix it ASAP. Looking forward to your feedback!

Otherwise, I hope this transfer makes life easier going forward and look out for more updates and information soon!

joet333 commented 1 week ago

Still need to organize and get a few more components moved over in the Design Library.

vickyszuchin commented 1 week ago

Moving this "In-progress" sprint 52 ticket to newly started Sprint 53.

joet333 commented 1 week ago

Create and organize a stand alone design system (.gov Design System) from working Figma files. Create new tickets are needed.

components moved, but organization and naming still needed

Align with design team on goals and progress

Presentation started and share out to happen after work is complete.

No new tickets needed yet.

joet333 commented 1 week ago

Updates made to .govDS figma file now reflect USWDS names where possible and organization has been completed.

https://docs.google.com/document/d/1gLJGzRmRlXl8ohfL1BKbXKziVz6fmDZVMN-0TjoLznM/edit ^^ doc above lists all changes made. Next step will be to prioritize component audit updates and finish presentation of changes.

joet333 commented 1 week ago

Presentation created and waiting for review. Then will get it scheduled for presenting.

Want to pre-share like i did before. When would be best to share Figma tutorial help to developers? (@abroddrick @Katherine-Osos ) -- see below --

Figma Onboarding for Devs Figma - learn by watching Basics video (10 min) Figma for Developers (11 min) Figma - learn by doing Figma onboarding - Basics Figma 101 - Intermediate Figma 102 - Advanced

Figma - learn by teaching (optional) Find one tip or trick for using Figma and share with the team

joet333 commented 4 days ago

Have a few updates to make to presentation from Katherine's review. Otherwise good to schedule presentation.

joet333 commented 4 days ago

Updates have been made. Now just need to present. Marking as done. https://docs.google.com/presentation/d/1yPZ-LI8NyuKqHeCbeTWIwsB8V7uG_AKk/edit#slide=id.g28599b298ed_2_87