Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update copy-delivery.md #2388

Closed
wants to merge 7 commits into from
Closed

Update copy-delivery.md #2388

wants to merge 7 commits into from

Conversation

srhhnry
Copy link

@srhhnry srhhnry commented Sep 20, 2024

Updated copy

@srhhnry srhhnry requested a review from a team as a code owner September 20, 2024 20:22
@github-actions github-actions bot added the documentation [auto] Improvements or additions to documentation label Sep 20, 2024
Copy link

github-actions bot commented Sep 20, 2024

Coverage report

This PR does not seem to contain any modification to coverable code.

Copy link


Ditto is our copy management system for Benefits and the Cal-ITP sites. It syncs directly with Figma and uses many of the same conventions found in Figma, including components and variables (therefore, it is important to be specific when referring to a Ditto component or a Figma variable).

The Benefits project within Ditto is fully synced with Figma. Product and design may use either Figma or Ditto as their source of truth on copy, though it is recommended that Developers use Figma for all final copy. Compiler is considering using the Github integration that comes with Ditto, but has not formally integrated Ditto into their workflow as of yet.
Copy link
Member

@machikoyasuda machikoyasuda Sep 23, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Questions for @srhhnry

  • It makes sense to me for developers to use Figma to copy and paste English copy, but for getting Spanish copy, we'd have to go into Ditto, right? Or is there a way to check Figma for Spanish copy?

  • I know we're now using the Ready for dev status in Figma to communicate when a design is ready for development. But is there something similar for copy in Ditto? How are we Engineers to know when both English and Spanish copy is ready for dev from Figma or Ditto?

image

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • For viewing copy in Spanish in Figma, one needs to have the Ditto plugin active. From there, select a frame and the Ditto plugin should automatically move to the Selected tab, and within that tab there's a dropdown to preview different variants.
image

Everyone has varying levels of permission, so if it is not possible to view that tab within the Ditto plugin, then yes I recommend using Ditto.

(should the above^ go into the documentation as well?)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is exactly the kind of instruction that should go in the Documentation. A good rule of thumb is: If you think you might have to copy/paste the same instructions to more than 1 person, it should be in the Docs. You could format is as 1, 2, 3 numbered instructions.

- `forTranslation` and `All Agencies` tab contains the English and Spanish translation side by side, with agency-specific copy.
Figma is our primary design tool and is the source of truth for all design decisions, concepts, and directions for the Benefits app and all Cal-ITP sites. We have Figma Organization which includes developer mode, version history, and branching–a tool to explore new design directions.

The development team prefers not to have admin or editor capabilities so as not to accidentally interfere with any designs. Currently there is no formal process within Figma for handoff. Instead handoffs occur over the course of two meetings, a review of the designs and then what we call “issue-fest,” or a chance for developers to create Github issues while designers can weigh in and answer questions.
Copy link
Member

@machikoyasuda machikoyasuda Sep 23, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
The development team prefers not to have admin or editor capabilities so as not to accidentally interfere with any designs. Currently there is no formal process within Figma for handoff. Instead handoffs occur over the course of two meetings, a review of the designs and then what we call “issue-fest,” or a chance for developers to create Github issues while designers can weigh in and answer questions.
The development team prefers not to have admin or editor capabilities so as not to accidentally interfere with any designs. Currently there is no formal process within Figma for handoff. Instead handoffs occur over the course of two meetings, a review of the designs and then what we call “issue-fest,” or a chance for developers to create GitHub issues while designers can weigh in and answer questions.

@srhhnry

  • Aren't we gonna use the Ready for dev feature in Figma for handoff? At handoff or issue-fest, not sure which, Design will also Merge the current Figma Branch into the main Branch, so that also indicates a new status.
image
  • If anyone (Product, Engineering) has concerns about copy, should they put a comment on Ditto, on Figma, or some other way?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • Yup, I can write the Ready for Dev element in. I'd say we don't have a hands off approach with Figma though, and we rely on meetings/verbal communication over asset deliverable. Not sure when merging should happen. This time it happened after issue-fest (same meeting as hand-off), but I can see where merging after hand-off, and any updates, but before issue fest would be best. That way there's still a chance to see if there are any mistakes on the board and correct in real-time, as merging is a bit of a manual process.

  • My strong preference for comments is to have them in Figma. But I think we should note this is subject to preference and can change based on team dynamics.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm re-reading this section and I realized one thing that is confusing me: Instead handoffs occur over the course of two meetings, a review of the designs and then what we call “issue-fest,” or a chance for developers to create Github issues while designers can weigh in and answer questions.

Maybe instead of having 2 meetings that are both called handoffs, the last meeting should be The Hand-Off. And the first meeting is a Design Review. I think we can be explicit in our definition of what a handed-off design looks like.

A handed-off design means:

  • The Figma file is fully synced with copy from Ditto and CrowdIn.
  • The copy is production-ready in English and Spanish.
  • The new designs in Figma are marked as "Ready for Dev".
  • The new designs in Figma, which were previously in a branch, are now merged into the main branch.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If your preference is for comments in Figma, then we can make that the policy. You can note that all comments on copy or design should be made in Figma, and that all comments need to be submitted by the Hand-Off meeting. No comments should be added after the Hand-Off meeting ( as in, engineers cannot ask design to change anything after hand-off. that would be a new design process ).

Copy link
Member

@machikoyasuda machikoyasuda left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I updated the Engineering responsibilities part, and then added some questions and suggestions for Sarah.

srhhnry and others added 4 commits September 25, 2024 06:24
Co-authored-by: machiko <machiko@compiler.la>
Co-authored-by: machiko <machiko@compiler.la>
Co-authored-by: machiko <machiko@compiler.la>
Co-authored-by: machiko <machiko@compiler.la>
@machikoyasuda
Copy link
Member

Just to make sure you know this, a preview can be viewed here: https://benefits-2388--cal-itp-previews.netlify.app/product-and-design/copy-delivery/ @srhhnry

@machikoyasuda
Copy link
Member

Closing this ticket for now. Will re-open PR with text that is ready.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation [auto] Improvements or additions to documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Update documentation to reflect changes in the copy delivery process
2 participants