Zbuduj 5 stron internetowych w mniej niż godzinę za pomocą ChatGPT-5: Jak to zrobić i sekrety podwojenia produktywności

Aplikacje do projektowania stron internetowych Obecnie dostępne. Sam wypróbowałem kilka, ale żaden nie był tak łatwy w użyciu, jak mi się wydawało. CzatGPT-5 Do programowania wszystkiego, od czcionek i kolorów po cały projekt. ChatGPT-5 jest w tym doskonały. Twórz aplikacjeWięc pomyślałem, że i z tym zadaniem poradzi sobie dobrze.

Zbuduj 5 stron internetowych w mniej niż godzinę dzięki ChatGPT-5: poradnik Toma, jak to zrobić i sekrety podwojenia produktywności

W rzeczywistości po prostu zacząłem od wydania następującego polecenia: CzatGPT-5: „Stwórz dla mnie stronę internetową”. W ten sposób stworzyłem kompletną, choć generyczną, stronę internetową. Wydawało się to zbyt piękne, aby mogło być prawdziwe. Postanowiłem wypróbować to bardziej szczegółowo, tworząc prawdziwą stronę internetową.

W ramach tego eksperymentu stworzyłem wiele firm – od placów zabaw w pomieszczeniach po firmy marketingowe – i zaprojektowałem korporacyjne strony internetowe za pomocą ChatGPT-5. Oto wyniki i wskazówki, których użyłem.

1. Centrum ogrodnicze Always Spring

Zrzut ekranu

Prawo:„Zaprojektuj kompletną, kolorową i jasną stronę internetową dla Always Sunny Garden Center. Celem jest stworzenie atmosfery radości i dostatku dla odwiedzających, a także umożliwienie klientom łatwego znalezienia tego, czego potrzebują. Atmosfera firmy jest przyjazna, profesjonalna, ale nie onieśmielająca, rodzinna i pełna kolorów. Wyobraź sobie „radosny wiosenny dzień w ogrodzie”. Zadbaj o to, aby projekt był przejrzysty, przyciski czytelne, a kolory tworzyły jasną, zachęcającą i spójną atmosferę. Nawigacja powinna być intuicyjna i dobrze widoczna.”

To pytanie jest w rzeczywistości dość szczegółowe. Mógłbym pominąć około połowę tych informacji. Jednak gdyby to była moja prawdziwa firma, chciałbym dodać więcej informacji, takich jak adres firmy, certyfikaty czy konkretne szczegóły, takie jak czcionka i paleta kolorów. Największą zaletą jest to, że można modyfikować kod. Jeśli nie masz doświadczenia w programowaniu, nie ma problemu — po prostu poproś ChatGPT o potrzebne aktualizacje.

Stworzenie tej strony internetowej zajęło ChatGPT-5 około pięciu minut. Im bardziej szczegółowo opiszesz szczegóły swojej witryny, tym dłużej to potrwa. Możesz zobaczyć, jak „myśli” przez cały czas, pisząc kod. Prawdopodobnie mógłbyś robić coś innego podczas kompilacji, ale obserwowanie, jak działa, jest dla mnie dziwnie satysfakcjonujące.

2. Kryty plac zabaw dla maluchów Tumbles and Giggles

Zrzut ekranu

Prawo: „Zaprojektuj jasną, radosną i bardzo przejrzystą stronę internetową dla Tumbles & Giggles, krytego placu zabaw dla maluchów (w wieku 1-5 lat). Strona internetowa powinna zapewniać rodziców o bezpieczeństwie i czystości, a jednocześnie zachęcać do zabawy, jaką będą miały ich dzieci. Grupa docelowa: Rodzice, dziadkowie i opiekunowie maluchów. Powinni móc szybko znaleźć ceny, godziny otwarcia i informacje o bezpieczeństwie. Ogólny klimat: Radosny, nowoczesny, czysty i przestronny. Pomyśl o „radości i porządku”. Unikaj zagraconych i zatłoczonych projektów. Wykorzystaj dużo białej przestrzeni w jasnych, subtelnych kolorach.”

To był test w warunkach rzeczywistych, ponieważ zastanawiałem się, czy ChatGPT-5 wyświetli zdjęcia dzieci, a jeśli tak, to czy będą one wyglądać wystarczająco realistycznie na stronie internetowej firmy. Jak widać na zrzucie ekranu, nie było żadnych zdjęć dzieci. Nie byłoby to idealne rozwiązanie dla firmy oferującej usługi dla rodzin; uśmiechnięte twarze z pewnością pomogłyby w promocji lokalu.

Z tego powodu, gdyby to był mój prawdziwy cel, poprosiłbym ChatGPT o ponowne rozpatrzenie. Poza tym strona wygląda dobrze i jest kompletna z wyraźnym zastrzeżeniem prawnym na początku.

3. Kawiarnia Daily Grind

Zrzut ekranu witryny

Prawo:Zaprojektowaliśmy stronę internetową dla modnej, przytulnej i przyjaznej kawiarni osiedlowej o nazwie The Daily Grind. Strona powinna zachęcać użytkowników do spróbowania naszej kawy i ciastek oraz zachęcać ich do odwiedzenia lokalu. Strona powinna być wizualnie zorientowana i podkreślać poczucie wspólnoty oraz przyjemność z delektowania się kawą w komfortowym otoczeniu. Strona powinna być atrakcyjna dla mieszkańców, pracowników zdalnych, studentów i osób poszukujących miejsca spotkań. Powinni mieć możliwość zapoznania się z menu, znalezienia lokalizacji/godzin otwarcia i poczucia klimatu kawiarni. Ogólna atmosfera powinna być swobodna, przyjazna, modna i towarzyska. Zdjęcia powinny być autentyczne i przedstawiać ludzi dobrze się bawiących.

Pierwsze dwie strony były dobre, ale nieco podobne. (Powinienem powiedzieć: nudne?) Oprawa wizualna pozostawiała wiele do życzenia. Potrzebowałem, aby ChatGPT-5 podniósł poprzeczkę, więc w tym wymaganiu wyraźnie wspomniałem o „zdjęciu”, aby sztuczna inteligencja wiedziała, że ​​potrzebujemy lepszej oprawy wizualnej dla tej strony.

Byłem rozczarowany, że pierwsza wersja strony nie zawierała żadnych obrazów ludzi. Strona była zresztą bardzo podobna do innych. ChatGPT-5 ewidentnie miał szablon. Przekierowałem więc sztuczną inteligencję i poprosiłem ją o dodanie obrazów.

Wydawało się, że to proste żądanie prawie zawiesiło mój komputer, ponieważ dodałem tysiące obrazów. Kompletna porażka.

4. Strona internetowa marketingowa napoju gazowanego Tangerine Twist

Zrzut ekranu witryny

Prawo: "Stwórz wysoce konwertującą, jednostronicową witrynę marketingową (landing page) dla Tangerine Twist. To naturalnie słodzony napój gazowany, wyprodukowany z prawdziwego soku mandarynkowego. Jest organiczny i cieszy się popularnością wśród świadomych ekologicznie konsumentów z pokolenia Z. Dołącz 3-5 zdjęć młodych ludzi delektujących się napojem (w zabawnych pomarańczowych puszkach). Ton powinien być energiczny, innowacyjny i autentyczny.

Po raz kolejny ChatGPT nie dodał do kodu obrazów na żywo, mimo że prosiłem o to w instrukcji. Będę musiał zmodyfikować kod i poprosić o zaktualizowaną stronę z obrazami.

Spodobał mi się jednak proces prezentacji produktu generowany przez sztuczną inteligencję, a teksty reklamowe były bardzo dobre. Spodobała mi się również „100-dniowa gwarancja zadowolenia” wspomniana na dole strony.

Chociaż strona wygląda bardzo podobnie do innych stron, które stworzyłem, wyraziste kolory i teksty reklamowe pomagają jej się wyróżnić.

Kod został utworzony. Co dalej?

kodowanie wibracji

Dobre pytanie! Po zakończeniu pracy z ChatGPT-5 możesz uruchomić stronę w przeglądarce, aby upewnić się, że wygląda i działa zgodnie z oczekiwaniami. Jeśli coś jest nie tak, wprowadź poprawki, ale gdy wszystko będzie gotowe, pobierz lub skopiuj kod lokalnie. Możesz to zrobić, kopiując kod do plików tekstowych na komputerze i nadając im odpowiednie nazwy. (Przykład: index.html dla strony głównej, style.css dla stylów, script.js dla JavaScript).

Następnie musisz wybrać dostawcę hostingu. Możesz to zrobić, korzystając z darmowych, przyjaznych dla początkujących stron, takich jak GitHub Pages. Alternatywnie możesz skorzystać z hostingu współdzielonego, takiego jak Bluehost. Usługi w chmurze (AWS, Google Cloud, DigitalOcean) są dobre, ale wymagają bardziej zaawansowanej konfiguracji.

Oczywiście, będziesz chciał kupić nazwę domeny, a następnie połączyć ją z usługodawcą hostingu, dzięki czemu Twoja witryna będzie wyświetlana pod wybraną przez Ciebie nazwą, a nie pod ogólnym adresem URL.

Na koniec prześlij pliki na platformę hostingową. Wiele usług pozwala na przeciąganie i upuszczanie, przesyłanie plików przez Git lub korzystanie z narzędzia CLI. Po przesłaniu Twoja strona będzie dostępna dla wszystkich.

Podsumowując

ChatGPT sprawdza się całkiem nieźle, jeśli chodzi o szybkie tworzenie strony internetowej w krótkim czasie. W przypadku dodatkowych elementów, takich jak zdjęcia czy realistyczne grafiki, konieczne będzie ponowne wyświetlenie monitu; dołączenie ich do pierwszego monitu wydaje się nieskuteczne.

Użycie ChatGPT do zbudowania witryny to dobry pomysł dla kogoś, kto chce szybko uruchomić swoją witrynę. Możesz otrzymywać powiadomienia, prezentować swoje produkty i podawać dane kontaktowe. Jednak, jeśli zależy Ci na zaawansowanych funkcjach, będziesz potrzebować trochę więcej czasu.

Możliwość dodawania komentarzy nie jest dostępna.