histoire-dev / histoire-dev/histoire

Figma addon/plugin

Open
#154 1 comment 7 reactions 0 assignees View on GitHub
enhancement
Dominant language
TypeScript
Stars
3.6k
Forks
212
PR merge metrics
No merged PRs in 30d

Description

### Clear and concise description of the problem

Since Histoire will bring down the gap between devs and designers, why not add the most popular [design tool ](https://www.figma.com/) to Histoire so the handover is even easier?

### Suggested solution

A Plugin/Addon that allows embedding the correspondent design from Figma into one of the tabs.

So the developer can contrast the design with their components without leaving the tool

### Alternative

_No response_

### Additional context

https://storybook.js.org/addons/storybook-figma

### Validations

- [X] Follow our [Code of Conduct](https://github.com/histoire-dev/histoire/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/histoire-dev/histoire/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://histoire.dev/guide/).
- [X] Check that there isn't [already an issue](https://github.com/histoire-dev/histoire/issues) that requests the same feature to avoid creating a duplicate.

Contributor guide

Open the contributing guide

Research direction

The issue names no source files, tests, or implementation entry points. Start by reading Histoire's addon or tab architecture and the linked Storybook Figma addon, then determine how a Figma design could be embedded; done would mean a working Figma view in a component tab that supports comparing the design without leaving Histoire.

Written by the indexing model from the issue text.

Assessment

Tech stack
figma
Domain
design, developer-experience
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.