Źródłowe pliki SVG do edycji
Zmieniaj teksty, kształty i układ. Zachowaj oryginalny pakiet jako punkt odniesienia, a poprawki wprowadzaj w kopii roboczej.
Projektowanie serwisu obrazów AI · Pakiet SVG
Makiety UI generatora obrazów AI: zaplanuj ekrany przed wdrożeniem
Te makiety UI pomagają niezależnym programistom i zespołom produktowym połączyć generowanie obrazów, historię prac i wybór planu. Sprawdź układ ekranów, zanim zaczniesz implementację. Pliki SVG możesz dostosować do swoich pól, tekstów i kolorów za pomocą bezpłatnego AI UI Designer Skill w Codex lub Claude Code.
W ramach aktywnej płatnej subskrypcji. Pobranie nie zużywa kredytów.
Statyczne projekty SVG · Przykładowe teksty po chińsku · Bez kodu aplikacji
- Strony na komputer
- 6
- Motywy kolorystyczne
- 2
- Referencje mobilne
- 2
- Edytowalne źródła
- SVG
Co użytkownik zrobi po wygenerowaniu obrazu?
Przejrzyj wejście do usługi, tworzenie obrazów, wyszukiwanie prac i wybór planu. Każda strona na komputer ma wireframe w skali szarości oraz jasną i ciemną wersję projektu.
Strona główna
Zaplanuj opis usługi, przykładowe obrazy i wejście do generowania.
Logowanie i rejestracja
Sprawdź pola logowania oraz rejestrację i komunikaty błędów na tablicy stanów.
Generowanie obrazów
Rozmieść opis, model, proporcje, liczbę obrazów, koszt w kredytach i wyniki.
Historia obrazów
Przejrzyj wyszukiwanie, szczegóły, ponowne użycie parametrów i potwierdzenie usunięcia.
Plany i kredyty
Porównaj saldo, przykładowe plany i projekty wyników zakupu.
Ustawienia konta
Zaplanuj pola profilu, potwierdzenie zapisu i wylogowanie.
Podglądy zawierają chińskie teksty przykładowe i fikcyjne dane produktu. Przyciski, formularze i ekrany zakupu są statycznymi projektami.
Uwzględnij puste ekrany, oczekiwanie i błędy
ZIP łączy projekty stron, komponenty i opis scenariusza. Możesz porównywać zmiany z pozostałymi ekranami usługi.
Od struktury do kolorów
Do projektów dołączono pliki JSON motywów: 2. Najpierw sprawdź hierarchię informacji w wireframe, a potem wybierz jasny lub ciemny wygląd.
Komponenty i stany interfejsu
Przejrzyj przyciski, pola, listy wyboru, karty i okna dialogowe oraz stany generowania w toku, pustej historii, braku kredytów, błędu logowania i nieudanej płatności.
Jasny zakres wersji mobilnych
Ekran generowania i historia mają projekty o szerokości 390px. Dla innych stron zachowanie mobilne opisano w scenariuszu; osobne projekty mobilne nie są dołączone.
Zaimportuj ZIP i dopasuj projekt do swoich wymagań
Pakiet można importować za pomocą bezpłatnego Skill. Skrypty pomocnicze wymagają Python 3.9 lub nowszego.
- 1
Pobierz pliki w ramach subskrypcji
Zaloguj się na konto z aktywną płatną subskrypcją AI UI Designer. Pobranie pakietu nie zużywa kredytów do generowania.
- 2
Przekaż asystentowi ścieżkę do ZIP
Zainstaluj AI UI Designer Skill w Codex lub Claude Code, podaj lokalną ścieżkę do ZIP i poproś o import pakietu.
- 3
Opisz zmiany i sprawdź SVG
Wybierz motyw oraz określ pola, teksty i układ. Oceń wynik i poprawiaj kopię roboczą, zachowując pliki oryginalne.
Przykład: panel zdjęć produktowych do sklepu internetowego
Użyj jasnego motywu pakietu generowania obrazów, aby zaprojektować panel zdjęć produktowych. Uwzględnij nazwę produktu, opis oczekiwanego obrazu i wybór proporcji. Zachowaj informację o koszcie w kredytach i karty wyników. Przygotuj edytowalny projekt SVG.
Projekt od własnych wymagań czy gotowy punkt wyjścia?
Bezpłatny Skill pozwala projektować od wymagań, importować pakiety i stosować motywy. Pobranie tego zestawu ekranów ze strony wymaga aktywnej płatnej subskrypcji.
- Projekt od własnych wymagań
- Bezpłatny Skill · Bezpłatnie
- Import pakietów i stosowanie motywów
- Bezpłatny Skill · Bezpłatnie
- Pobranie tego zestawu stron
- Pakiet scenariusza · Aktywna płatna subskrypcja
- Lokalne używanie pobranych plików
- Pakiet scenariusza · Także po zakończeniu subskrypcji
FAQ
Pliki, język i warunki pobrania
Sprawdź zakres materiałów projektowych i elementy wymagające osobnego wdrożenia.
Oceń przebieg pracy, zanim dopasujesz ekrany
Przejrzyj makiety UI generowania, historii i planów. Jeśli odpowiadają potrzebom produktu, pobierz SVG w ramach aktywnej płatnej subskrypcji i dostosuj je za pomocą bezpłatnego Skill.
Pobierz projekty SVGW ramach aktywnej płatnej subskrypcji. Pobranie nie zużywa kredytów.