Prośba o ofertę usługi projektowania stron internetowych w Figma dla małych firm

1. Wprowadzenie

Niniejsza propozycja projektu przedstawia naszą kompleksową ofertę świadczenia usługi projektowania stron internetowych opartej na Figma dla nowego redesignu strony internetowej Nuwa, w związku z całkowitym rebrandingiem. Przebudowana strona odzwierciedli przywództwo Nuwa w zakresie komercjalizacji badań, technologii i innowacji oraz wpływu społecznego, jednocześnie uwzględniając jej imperatywy komercyjne. Nasza propozycja szczegółowo opisuje zakres prac, wymagania projektowe i techniczne, kamienie milowe projektu, strukturę cenową oraz nasz proces współpracy, aby zapewnić płynne przekształcenie cyfrowej obecności Nuwa.

2. Tło i przegląd projektu

Nuwa ma na celu przekształcenie swojej obecności cyfrowej w Centrum Doskonałości i Innowacji, które nie tylko napędza sukces komercyjny, ale także pokazuje znaczący wpływ społeczny. Nowa strona internetowa będzie służyć różnorodnym odbiorcom, w tym instytucjom finansującym, globalnym partnerom, badaczom i klientom biznesowym, oraz ułatwi odwiedzającym eksplorację naszych drugorzędnych marek. Czerpiąc inspirację z wiodących stron internetowych branży i stron poświęconych innowacjom, brief projektowy obejmuje wiele sekcji:

• STRONA GŁÓWNA: Baner główny, dynamiczne podkreślenia wpływu i jasne CTA
• BRANŻE: Szczegółowe strony podzielone na Ochronę Humanitarną i Cywilną, Sztuki Sceniczne oraz Media i Rozrywkę
• TECHNOLOGIE: Szczegółowe informacje na temat Chmury, Edge, Danych i AI, IoT oraz technologii immersyjnych
• WNIOSKI: Zgromadzone myślenie liderów, wiadomości i treści badawcze
• PARTNERZY: Kompleksowe profile partnerów 
• KONTAKT: Interaktywne opcje kontaktu

Nasz projekt migracji i redesignu oparty jest na nowoczesnych technologiach, wykorzystujących framework NextJS z rozwojem front-endu w React, Payload CMS do zarządzania treścią oraz Storybook do dokumentacji komponentów. Figma będzie głównym narzędziem projektowym dla tego "Zapytania o ofertę usługi projektowania stron internetowych", aby stworzyć zintegrowany system projektowy zgodny z naszymi wytycznymi marki i ściśle zintegrowany z naszym CMS.

3. Zakres prac

3.1 Strategia projektowania i dostarczane materiały

• Plik(i) Figma:
  • Dokument główny Figma podzielony na następujące sekcje:
    • Zintegrowany system projektowy, 
    • Bloki segmentowe, 
    • Bohaterowie i układy, oraz;
    • Strona pełnoekranowa i szablony.
  • Włączenie tokenów projektowych (kolory semantyczne, skale typograficzne, mnożniki odstępów, ...) w celu zapewnienia spójności.
  • Referencje takie jak https://fluent2.microsoft.design/ oraz https://carbondesignsystem.com/ są naszymi rekomendacjami jako standard do naśladowania.
• Biblioteka komponentów:
  • Repozytorium wielokrotnego użytku komponentów (przyciski, formularze, ikony, karty) z zablokowanymi elementami o wysokim wpływie (np. CTA bohaterów, główna nawigacja), aby zapobiec niezgodnościom.
• Dokumentacja i mapowanie:
  • Szczegółowe wytyczne dotyczące użycia komponentów oraz dokumenty mapujące, aby zapewnić programiście front-endowemu jasną korelację między każdym komponentem Figma a odpowiadającym mu blokiem Payload CMS i komponentem Storybook.

3.2 Wymagania techniczne

• Responsywne projektowanie:
  • Ramki auto-layout Figma, które wymuszają responsywne zachowanie z wstępnie ustawionymi punktami przerwania, minimalnymi/maksymalnymi szerokościami treści i proporcjami odstępów dla następujących punktów przerwania:

    Klasa rozmiaru	Zakres punktów przerwania	Punkty przerwania
    mały	320-479	640px lub mniej
    średni	480-639	641px do 1007px
    duży	640-1023	1008px i więcej
    x-duży	1024-1365	1008px i więcej
    xx-duży	1366-1919	1008px i więcej
    xxx-duży	1920 i więcej	1008px i więcej

• Zgodność z dostępnością (WCAG 2.1)
• Wsparcie dla trybu ciemnego/jasnego
• Spójność marki
• Łatwość integracji CMS i warsztatów front-endowych dla programistów front-endowych
• Architektura systemu projektowego:
  • Przyjęcie zasad projektowania atomowego i struktur komponentów opartych na ograniczeniach, aby utrzymać spójną język projektowy oparty na  https://fluent2.microsoft.design/ oraz https://carbondesignsystem.com/.

4. Proces i współpraca

Nasze podejście kładzie nacisk na współpracę, przejrzystość i iteracyjne doskonalenie:

• Wspólne tworzenie wireframe'ów:
  • Inicjowanie wspólnych sesji z właścicielami treści, projektantami i inżynierami w celu dostosowania się do kluczowych komunikatów.
• Pętle feedbackowe:
  • Regularne przeglądy interesariuszy i strukturalne sesje feedbackowe, aby zapewnić zgodność z naszymi celami strategicznymi.
• Zapewnienie jakości:
  • Ciągłe testowanie za pomocą Storybook w celu weryfikacji zachowania komponentów na różnych urządzeniach oraz zgodności z tokenami projektowymi.

5. Warunki i zasady

• Własność intelektualna:
  • Wszystkie dostarczane materiały i związane z nimi materiały staną się własnością Nuwa po pełnej płatności.
• Poufność:
  • Obie strony zgadzają się na zachowanie poufności w odniesieniu do informacji zastrzeżonych.

9. Wytyczne dotyczące składania ofert

Zainteresowani projektanci są zaproszeni do składania swoich propozycji. Propozycje mogą obejmować:

• Podsumowanie twojego zrozumienia wymagań Nuwa.
• Sporządzoną metodologię i harmonogram projektu.
• Przykłady portfolio związane z projektowaniem stron internetowych w Figma.
• Jakiekolwiek dodatkowe dokumenty, które wspierają twoje umiejętności techniczne i projektowe.

10. Aneks

Następujące zasoby są dołączone do briefu projektowego:

• Referencje projektowe, wymagania i specyfikacje
• Księga marki Nuwa oraz wytyczne (wszystkie dodatkowe zasoby zostaną udostępnione na początku projektu za pośrednictwem WeTransfer)

Dostęp do komponentów UI i bibliotek może być zapewniony:

• Hero UI, Tailwind CSS Plus, Aceternity UI oraz 21st.dev