Przejdź do głównej zawartości

Wymagania dotyczące zrzutów ekranu — dokumentacja PDF Connect v3

Priorytet 1: Główny przepływ pracy (wymagane) 📸​

Główny interfejs aplikacji​

  1. Panel PDF Connect v3 — Główny interfejs prezentujący nowoczesny design
  2. Zarządzanie biblioteką PDF — Widok siatki z wyszukiwaniem, tagami i operacjami zbiorczymi
  3. Strona szczegółów PDF — Widok pojedynczego pliku PDF z wyróżnionym przyciskiem Połącz

Uniwersalne łączenie​

  1. Menu rozwijane typów stron — Wszystkie obsługiwane typy stron (Produkty, Kolekcje, Artykuły, Strony, Strona główna, Wyszukiwanie)
  2. Modal wyboru zasobów — Pasek wyszukiwania, lista zasobów, paginacja, zaznaczanie zbiorcze
  3. Łączenie w toku — Stany ładowania i komunikaty potwierdzenia
  4. Wyświetlanie połączonych zasobów — Połączone strony z opcjami rozłączania

System publikowania​

  1. Modal opcji publikowania — Trzy style wyświetlania obok siebie
  2. Integracja z edytorem motywu — Dodawanie bloków PDF do szablonów
  3. Konfiguracja bloku — Panel ustawień dla każdego typu wyświetlania

Style wyświetlania w akcji​

  1. Przykład osadzonego PDF — Strona produktu z osadzonym plikiem PDF
  2. Przykład przycisku PDF — Przycisk z otwartą nakładką popup
  3. Przykład listy PDF — Wiele plików PDF w zorganizowanej liście

Priorytet 2: Zaawansowane funkcje (ważne) 📸​

Strategia wielu bloków​

  1. Strona produktu z wieloma blokami — Ta sama strona z osadzonym + przyciskiem + listą
  2. Przegląd statusu szablonów — Które szablony mają skonfigurowane bloki
  3. Interfejs zaznaczania zbiorczego — Wiele zaznaczonych elementów z licznikiem

Doświadczenie mobilne​

  1. Przeglądanie PDF na urządzeniu mobilnym — Wszystkie trzy style wyświetlania na telefonie
  2. Mobilny interfejs administracyjny — Łączenie i publikowanie na urządzeniu mobilnym
  3. Zachowanie responsywne — Jak pliki PDF dostosowują się do rozmiarów ekranu

Przykłady przepływów pracy​

  1. Porównanie przed/po — Stary vs. nowy interfejs
  2. Łączenie między stronami — Ten sam PDF połączony z wieloma typami stron
  3. Funkcja wyszukiwania — Wyniki wyszukiwania w czasie rzeczywistym

Priorytet 3: Treści uzupełniające (mile widziane) 📸​

Przykłady przypadków użycia​

  1. Dokumentacja produktu — Integracja instrukcji technicznej
  2. Katalogi kolekcji — Strona kolekcji z katalogiem PDF
  3. Zasoby bloga — Artykuł z plikiem PDF do pobrania
  4. Funkcje strony głównej — Broszura firmowa na stronie głównej

Błędy i przypadki graniczne​

  1. Stany ładowania — Co widzą użytkownicy podczas przetwarzania akcji
  2. Komunikaty o błędach — Przejrzysta komunikacja błędów
  3. Puste stany — Co widzą nowi użytkownicy przed dodaniem treści

Analityka i wydajność​

  1. Analityka użytkowania — Metryki zaangażowania z plikami PDF (jeśli dostępne)
  2. Wskaźniki wydajności — Dane dotyczące szybkości i optymalizacji
  3. Analityka szablonów — Które szablony są najczęściej używane

Specyfikacje zrzutów ekranu​

Wymagania techniczne​

  • Rozdzielczość: High-DPI dla wyraźnego wyświetlania w dokumentacji
  • Przeglądarka: Chrome lub Safari dla spójnego renderowania
  • Rozmiar okna: Standardowy desktop (1920x1080) i mobilny (375x812)
  • Motyw: Czysty, profesjonalny motyw Shopify do demonstracji

Wymagania dotyczące treści​

  • Przykładowe pliki PDF: Realistyczne dokumenty biznesowe (instrukcja, katalog, przewodnik)
  • Testowy sklep: Produkty, kolekcje, artykuły, strony wypełnione odpowiednią treścią
  • Czyste dane: Profesjonalne nazwy, opisy, zorganizowana zawartość

Wymagania dotyczące spójności wizualnej​

  • Spójny UI: Wszystkie zrzuty ekranu powinny przedstawiać tę samą wersję aplikacji
  • Profesjonalny wygląd: Przejrzysty, zorganizowany interfejs
  • Wyraźny fokus: Podświetlenie konkretnej prezentowanej funkcji

Przepływ pracy przy tworzeniu zrzutów ekranu​

Faza przygotowawcza​

  1. Skonfiguruj testowy sklep z realistyczną zawartością
  2. Utwórz przykładowe pliki PDF z profesjonalnymi nazwami
  3. Skonfiguruj wszystkie trzy style wyświetlania
  4. Przetestuj poprawne działanie wszystkich funkcji

Faza przechwytywania​

  1. Wykonaj zrzuty ekranu desktopowe w pełnej rozdzielczości
  2. Uchwyć wersje mobilne kluczowych interfejsów
  3. Udokumentuj stany ładowania i błędów
  4. Uzyskaj porównania przed/po tam, gdzie jest to istotne

Faza przetwarzania​

  1. Przytnij zrzuty, aby skupić się na istotnych elementach interfejsu
  2. Dodaj objaśnienia i adnotacje tam, gdzie jest to pomocne
  3. Zapewnij spójny styl wizualny we wszystkich obrazach
  4. Zoptymalizuj rozmiary plików dla dostarczania przez sieć

Użycie w dokumentacji​

Strategia rozmieszczenia​

  • Obrazy główne: Główne zmiany interfejsu na początku dokumentu
  • Krok po kroku: Zrzut ekranu dla każdej czynności w samouczkach
  • Porównanie: Przed/po dla najważniejszych ulepszeń
  • Odwołanie: Szybkie wizualne potwierdzenie lokalizacji/wyglądu

Wymagania dotyczące tekstu alternatywnego​

Wszystkie zrzuty ekranu wymagają opisowego tekstu alternatywnego dla dostępności:

  • Opisz, co jest widoczne w interfejsie
  • Uwzględnij kluczowy tekst widoczny na obrazie
  • Zaznacz ważne elementy UI lub akcje
  • Staraj się nie przekraczać 125 znaków

Konwencja nazewnictwa plików​

Używaj spójnego nazewnictwa dla łatwego zarządzania:

  • pdf-guru-v3-[funkcja]-[kontekst].png
  • Przykład: pdf-guru-v3-linking-page-types.png
  • Przykład: pdf-guru-v3-display-embedded-product.png

To systematyczne podejście zapewnia kompleksową dokumentację wizualną, która dorównuje jakością ulepszonym funkcjom PDF Connect v3.