Steg 2: Anslut Google Gemini-inloggningsuppgifter

AI-komponenterna använder Gemini-chattmodeller för klassificering, omordning och generering av vägledning.

1. Öppna Gemini Chat Engine och välj era Google Gemini-inloggningsuppgifter.
2. Credential Required: Anslut era googlePalmApi-inloggningsuppgifter.
3. Öppna Gemini Reorder Engine och välj samma Google Gemini-inloggningsuppgifter.
4. Credential Required: Anslut era googlePalmApi-inloggningsuppgifter.
5. Öppna Gemini Chat Model Core och välj samma Google Gemini-inloggningsuppgifter.

Steg 3: Konfigurera klassificering av ikonroller och parsing

Det här steget klassificerar ikoner efter roll och extraherar strukturerad JSON för vidare bearbetning.

1. Öppna Icon Role Classifier och ställ in Text till den angivna prompten, inklusive uttrycken för de uppladdade filerna.
2. Bekräfta att uttrycksreferenserna inkluderar {{ $json['The screen'].filename }} och {{ JSON.stringify($json.Icons) }}.
3. Verifiera att Gemini Chat Engine är ansluten som språkmodell för Icon Role Classifier (inloggningsuppgifter ställs in på Gemini Chat Engine).
4. Öppna Parse Categorizer Output och behåll JavaScript Code som det är för att ta bort code block-omslag och parsa JSON.
5. Säkerställ att körflödet kopplar Form Submission Trigger → Icon Role Classifier → Parse Categorizer Output.

Steg 4: Konfigurera omordning av ikoner och parsing

Arbetsflödet omordnar ikoner inom placeringar baserat på användningsfrekvens och tolkar resultatet inför det avslutande vägledningssteget.

1. Öppna Reorder LLM Chain och ställ in Text till prompten som innehåller placeringsarrayerna.
2. Behåll placeringsuttrycken intakta: {{ $json.placement.Left }}, {{ $json.placement.Right }}, {{ $json.placement.Center }}, {{ $json.placement.Bottom }}, {{ $json.placement["System-decided"] }}.
3. Verifiera att Gemini Reorder Engine är ansluten som språkmodell för Reorder LLM Chain (inloggningsuppgifter ställs in på Gemini Reorder Engine).
4. Öppna Parse Reorder Result och behåll JavaScript Code som tar bort code block-markörer och parsar JSON.
5. Säkerställ att körflödet kopplar Parse Categorizer Output → Reorder LLM Chain → Parse Reorder Result.

Steg 5: Konfigurera generering av UI-vägledning

Det här steget genererar det slutliga strukturerade designförslaget baserat på Apple HIG och den kategoriserade ikondata.

1. Öppna Generate UI Guidance och ställ in Text till den angivna prompten.
2. Bekräfta att det inbäddade uttrycket finns med: {{ $('Icon Role Classifier').item.json.output }}.
3. Verifiera att Gemini Chat Model Core är ansluten som språkmodell för Generate UI Guidance (inloggningsuppgifter ställs in på Gemini Chat Model Core).
4. Säkerställ att körflödet kopplar Parse Reorder Result → Generate UI Guidance.

Steg 6: Testa och aktivera ert arbetsflöde

Validera hela flödet med ett verkligt formulärinskick innan ni går live.

1. Klicka på Execute Workflow och skicka in formuläret från Form Submission Trigger med en skärmbild och en uppsättning ikoner.
2. Bekräfta att Icon Role Classifier producerar JSON i output, och att Parse Categorizer Output returnerar screen, groups och placement.
3. Kontrollera att Reorder LLM Chain returnerar JSON och att Parse Reorder Result parsar den till strukturerade fält.
4. Verifiera att Generate UI Guidance matar ut ett strukturerat designförslag baserat på Apple HIG.
5. Växla arbetsflödet till Active för att aktivera användning i produktion.