Przyjaciel zapytał mnie, czy mam jakieś dobre metody na generowanie kodu z Figma. Obecnie jego metoda polega na tym, że eksportuje kod HTML z Figma, a następnie pozwala GitHub Copilotowi przepisać wyeksportowany kod zgodnie z formatem komponentów w repozytorium. Uważa, że kopiowanie i wklejanie kodu oraz pisanie wielu wskazówek, aby Copilot przepisał, jest bardzo uciążliwe. Nie jestem zbyt zaznajomiony z Figma, więc zasugerowałem mu, aby spróbował po prostu zrzucić ekran z wyników Figma lub wyeksportować PNG, a następnie wysłać zrzut do Copilot, aby Copilot mógł wygenerować kod UI na podstawie zrzutu. Powiedział, że styl uzyskany w ten sposób nie jest tak dokładny jak ten wyeksportowany z Figma, ponieważ Figma ma precyzyjne kolory i rozmiary, a generowane przez AI nie są tak dokładne. Zasugerowałem mu, aby rozważył połączenie obu metod, jednocześnie eksportując kod i generując zrzut, a następnie wysyłając zrzut, wyeksportowany kod Figma i opis komponentów do AI (używając znaczników XML do oddzielenia wskazówek), aby móc uwzględnić zarówno generowanie UI, jak i dokładność stylu. Przykładowe wskazówki są następujące: [Zrzut UI] <Wyeksportowany kod Figma> [Kod Figma……] </Wyeksportowany kod Figma> <Opis komponentu UI> [Opis komponentu UI React……] </Opis komponentu UI> Powyżej znajduje się projekt UI oraz odpowiedni kod Figma, proszę odnieść się do opisu komponentu UI i użyć dostarczonych przeze mnie komponentów UI do ponownego wygenerowania kodu UI.
10,23K