Zbudowałem 9 stron internetowych w niecałą godzinę korzystając z usług Claude'a.

Sam eksperymentowałem z „kodowaniem inspirującym” i niedawno odkryłem, że w ramach subskrypcji można utworzyć do pięciu stron internetowych w jednej sesji. Claude Bezpłatnie. Po tym czasie będziesz musiał odczekać pięć godzin, aby ponownie skorzystać z usługi lub dokonać aktualizacji do Cloud Pro.

Zrobiłem test Claude Zbudowałem dziewięć unikalnych stron internetowych w niecałą godzinę. Oto rezultaty.

1. Strona docelowa dla starych gier arcade

Prawo:„Strona internetowa z grami arcade w stylu oldschoolowym, z neonowym stylem, pikselową czcionką, żywym, animowanym tłem i trzema dużymi, podświetlanymi przyciskami, które tworzą wrażenie klasycznej arkady. Dodano efekty dźwiękowe po najechaniu kursorem na przyciski.”

Zainspirowana retro automatami, ta neonowa strona naprawdę przypomina salon gier z lat 80. Grafika pikselowa jest naprawdę urocza, a każdy przycisk ma swój własny interaktywny efekt dźwiękowy. Dzięki świecącym akcentom w narożnikach i subtelnym efektom glitch, projekt jest dokładnie taki, jakiego oczekiwałem: responsywny, przyjazny dla klawiatury i gotowy do połączenia z prawdziwymi grami. Ogólnie rzecz biorąc, ta strona sprawia wrażenie, jakbyś wszedł prosto do klasycznego salonu gier.

2. Blog z prostymi przepisami

Prawo:„Prosty projekt strony głównej bloga z przepisami, z czystym, białym tłem, eleganckimi czcionkami szeryfowymi i siatką trzech kartek z przepisami. Każda karta powinna zawierać obraz, tytuł przepisu oraz efekt najechania kursorem, który ujawnia składniki. Zadbaj o to, aby była dostosowana do urządzeń mobilnych”.

Ta prosta strona główna bloga z przepisami jest elegancka i przejrzysta. Projekt dostosowany do urządzeń mobilnych oferuje łatwą interakcję dotykową z wyświetlaniem składników jednym dotknięciem, co czyni ją idealną do korzystania z niej na urządzeniach mobilnych. Typografia i odstępy między wierszami dobrze sprawdzają się na wszystkich rozmiarach ekranów.

Projekt idealnie łączy w sobie prostą funkcjonalność i wyrafinowaną typografię. Wyjątkowe detale, takie jak nakładające się animacje komponentów, spajają całą stronę, nadając jej ekskluzywny, przyjazny charakter.

3. Strona startowa inspirowana science fiction

Prawo: „Zaprojektuj futurystyczną, jednostronicową witrynę internetową dla fikcyjnej firmy zajmującej się wydobyciem kosmicznym. Dodaj animowane tło z gwiazdami wypełniającymi ekran, pogrubiony, metaliczny tekst z misją oraz animowany statek kosmiczny powoli przelatujący przez ekran. Dodaj przycisk wezwania do działania: „Dołącz do floty”.”

Od gier arcade z lat 80. po filmy science fiction – ta strona oferuje rozgwieżdżone tło wypełniające ekran migoczącymi gwiazdami, latającymi kometami i dryfującymi cząsteczkami kosmitów, a po ekranie przelatuje uroczy statek kosmiczny. Wyrazista metaliczna czcionka, błyszczący tekst i pulsujące przyciski dodają poczucia eksploracji.

Interaktywne elementy, takie jak ślady myszy, nawigacja klawiaturą i przewijanie paralaksy, naprawdę ożywiają doświadczenie użytkownika. Claude Doskonała praca ze szczegółami.

4. Strona z opowiadaniami dla dzieci

Prawo: „Zabawny i kolorowy projekt strony internetowej dla dziecięcej książeczki z bajkami. Użyj dużych, fantazyjnych czcionek, ilustracji zwierząt i przycisku, który przełącza trzy krótkie „strony” opowiadania za pomocą prostych animacji. Dodaj tło, które zmienia kolor na każdej stronie.”

Claude stworzył zachwycającą stronę internetową, która emanuje kapryśnym urokiem. Historia opowiada o trzech zwierzętach: lisie o imieniu Feliks, niedźwiedziu o imieniu Benny i motylu o imieniu Bella, które przeżywają barwną przygodę na trzech interaktywnych stronach.

Każda strona witryny charakteryzuje się wesołymi gradientami kolorów tła, żywymi emotikonami zwierząt i płynnymi animacjami, dzięki którym książka sprawia wrażenie prawdziwej, interaktywnej książki. Czcionki są wyraźne i radosne, a dodane animowane detale angażują i ogólnie rzecz biorąc, strona jest atrakcyjna dla młodych czytelników, zwłaszcza tych przyzwyczajonych do spędzania czasu przed ekranami.

5. Interaktywny panel danych

Prawo:Stwórz nowoczesny, ciemny panel danych z interaktywnymi wykresami, wykorzystujący dane pozorowane. Dodaj pasek boczny, zegar na żywo u góry oraz trzy wykresy: słupkowy, liniowy i kołowy. Dodaj efekty najechania kursorem i płynne przejścia między sekcjami.

Postanowiłem stworzyć tę stronę internetową jako przykład biznesowy. Ciemny panel zawiera wszystkie funkcje, o które prosiłem w poleceniu, w tym elegancki pasek boczny z płynnymi animacjami. Responsywny design działa zarówno na komputerach stacjonarnych, jak i na urządzeniach mobilnych i zawiera cztery główne sekcje z płynnymi przejściami.

Podoba mi się zegar czasu rzeczywistego w nagłówku, a interaktywne wykresy to świetny dodatek. Doceniam to, jak to dodało… Claude Dane fikcyjne, dzięki którym mogę zwizualizować widok.

6. Miejsce medytacji w ogrodzie zen

Prawo: „Stwórz prostą, jednostronicową stronę internetową do medytacji z delikatnym gradientem tła, animowaną wodą u dołu i kwitnącą wiśnią powoli opadającą płatkami na ekran. Dodaj duży przycisk „Rozpocznij medytację”, który odtwarza relaksującą muzykę ambientową i przechodzi w inspirujący cytat”.

Byłem bardzo zadowolony z efektu końcowego tej strony. Delikatne, gradientowe tło w kolorach takich jak brzoskwiniowy, różowy, koralowy i fioletowy wyróżnia się, sprzyjając wyciszeniu i uważności. Strona tworzy prawdziwie spokojną atmosferę, idealną do medytacji.

7. Rynek cyberpunku

Prawo: „Stwórz neonową, inspirowaną cyberpunkiem stronę internetową z futurystycznym targiem ulicznym. Użyj efektów glitch po najechaniu kursorem myszy, migających neonów i animowanych menu w stylu hologramu. Każda karta produktu powinna się świecić po najechaniu kursorem myszy i zawierać krótki efekt dźwiękowy synthwave. Dodaj powtarzającą się animację deszczu, aby stworzyć atmosferę ekscytacji”.

Cechą charakterystyczną tej witryny jest efekt atmosferyczny. Od powtarzających się animacji deszczu i migających neonów po animowane tło w formie siatki, witryna jest wizualnie atrakcyjna.

Trzy różne dźwięki syntezatora i interaktywne przyciski sprawiają, że ta strona jest łatwa w obsłudze i angażująca. Nie byłbym w stanie zaprogramować tych funkcji samodzielnie, gdybym… Claude Z całą akcją. Strona idealnie oddaje surowy klimat rozświetlonego neonami cyberpunkowego targu ulicznego z płynną animacją, autentycznymi dźwiękami synthwave i wciągającymi efektami wizualnymi.

8. Dziennik misji fantasy

Prawo:„Zaprojektuj stronę internetową z fantastyczną przygodą inspirowaną starożytnym manuskryptem. Spraw, by kursor w kształcie pióra świecił i pozostawiał po sobie iskierki, pasek boczny przypominał średniowieczną księgę zaklęć, a użytkownicy mogli „zbierać” trzy magiczne przedmioty, klikając ikony, które poruszają się po znalezieniu”.

Ten przykład dowodzi, że Claude Z łatwością poradzi sobie z magicznym projektem fantasy. Świecący kursor w kształcie pióra pozostawia migoczące ślady podczas eksploracji witryny, a menu nawigacyjne rozwija się niczym średniowieczna księga zaklęć oprawiona w skórę z animowanymi efektami najechania kursorem.

Główna treść opiera się na zwojach papirusu, ozdobionych starożytnymi inskrypcjami i ozdobną średniowieczną typografią, co nadaje stronie autentyczny, starożytno-światowy urok. Dzięki responsywnemu projektowi, interaktywnym podświetleniom i interaktywnym osiągnięciom, każde kliknięcie jest wypełnione starożytną, magiczną interakcją.

9. Adoptuj zwierzaka z kreskówki

Prawo: Stwórz zabawną, interaktywną stronę internetową, na której odwiedzający mogą „adoptować” kreskówkowego zwierzaka (kota, psa lub smoka). Każdy zwierzak powinien mieć animację bezczynności, reagować na kliknięcie (mruczenie, merdanie ogonem, ziewanie ogniem) i można go „karmić” przeciągając na niego ikony jedzenia. Dodaj wesołą muzykę w tle z opcją wyciszenia.

Stworzyłem interaktywną stronę internetową o adopcji zwierząt, która jest równie zabawna, co angażująca. Każde zwierzątko ma swoją własną postać z kreskówki o zabawnej osobowości. Łatwo… Claude Przeciągaj i upuszczaj jedzenie, aby je nakarmić, obserwuj, jak rosną ich wskaźniki zadowolenia i odblokuj zachwycające reakcje, od mruczenia po ziejące ogniem ryki.

Powtarzająca się, optymistyczna melodia pomaga stworzyć odpowiedni nastrój. Strona jest w pełni responsywna, przyjazna dla dotyku i przejrzyście zaprojektowana, aby zapewnić przyjemne, emocjonalne i interaktywne wrażenia.