Jak wygląda praca nad przygotowaniem szablonem strony internetowej?

0

Cześć wszystkim. Zacznę może od kontekstu mojego pytania. Otóż jeśli chodzi o mnie bawię się Backendem. Z Frontendu znam podstawy Html-a, Css-a oraz JavaScript-u, po to by w razie potrzeby "wyciosać" sobie jakąś stronę mogącą obsłużyć WebApi. Niemniej ciekawi mnie jak wygląda praca Frontend Dev-a. Chodzi mi o ogólną koncepcję, ogólne informacje bez wchodzenia w szczegóły
A więc do rzezy. Jak dobrze rozumiem to najpierw otrzymujecie projekt graficzny od UX/UI w formie pliku graficznego. Następnie zamieniać projekt do postaci Html-a i Css-a.
W tym momencie nasuwają mi się następujące pytania (pewnie niektóre z niech wydadzą się Wam głupie ale chciał lepiej zrozumieć waszą pracę):

  • czy zdjęcia które macie wrzucić na stronę otrzymujecie jako osobne pliki, czy wycinacie je z projektu?
  • czy otrzymujecie od UX/UI informacje jak się nazywają poszczególne czcionki, czy musicie szukać jakiś podobnych?
  • czy jako tło witryny ustawiacie odpowiednio dostosowany plik graficzny na bazie projektu od UX/UI, czy stylizujecie je w css?
  • generalnie jakiego zestawu informacji potrzebujecie by wykonać swoją prace?
2
Michał Jasiński napisał(a):

...najpierw otrzymujecie projekt graficzny od UX/UI w formie pliku graficznego. Następnie zamieniać projekt do postaci Html-a i Css-a.

Nie / tak / zalezy

W stronie o wysokiej intemsywnosci treści a małych narzutach graficznych (stronka biznesowa, a zwłaszcza zamknieta) wręcz przeciwnie. Plik graficzny nie pojawia się nigdy. Dla projektu o tym charakterze o wiele bardziej wyróżnia się bloki top-navigation left-navigation i mysli kategoriami obiektowymi niz odworowaniem bitmapy *)

Stronka z jednym przyciskiem ale dla Członka Zarządu d/s Marketingu , który innych rozumie tak jak siebie - jako komputerowych idiotów, zdecydowanie jak mówisz.

*) kiedyś miałem kontakt z zadowolonym z siebie graczem i grafikiem komputerowym, przynióśl ok 45 bitmapoów, nie opisanych ŻADNYM słowem, jakoby PROJEKT jakiegoś dziedzinowego sklepu / społecznościówki HWC dla gamerów. Jakoby "tylko" należało przerobić to w kod (oczywiście wiesz, gdzie prawa autorskie) ... nie powiem, ze zabiłem śmiechem, bo byłem zmuszony do zachowania grzecznego, ale ...

1

@Michał Jasiński:

Powiem Ci, zdecydowanie dziwnie zadajesz pytanie jak na kogoś kto przedstawia się jako backendowiec z podstawami HTML/CSS
To zadania dla grafika HTML-owego, który nigdy nie będzie niczego kodował.

0
AnyKtokolwiek napisał(a):

@Michał Jasiński:

Powiem Ci, zdecydowanie dziwnie zadajesz pytanie jak na kogoś kto przedstawia się jako backendowiec z podstawami HTML/CSS
To zadania dla grafika HTML-owego, który nigdy nie będzie niczego kodował.

Jestem hobbystą. Nigdy nie pracowałem komercyjnie. Podstaw frontu używam tylko do stworzenia jakiegoś formularza ewentualnie witryny wyświetlającej jakieś informacje

1
Michał Jasiński napisał(a):

Niemniej ciekawi mnie jak wygląda praca Frontend Dev-a. Chodzi mi o ogólną koncepcję, ogólne informacje bez wchodzenia w szczegóły

Żeby się o tym przekonać to najprościej byłoby przejrzeć jak wyglądają obecnie projekty graficzne w Figmie, "Adobe XD", lub Sketch'u.
Mogę podrzucić przykładowy projekt w figmie (https://www.figma.com/community/file/1239767732969254476) tylko z tego co kojarzę to trzeba mieć założone konto, aby go wyświetlić.


W tym momencie nasuwają mi się następujące pytania (pewnie niektóre z niech wydadzą się Wam głupie ale chciał lepiej zrozumieć waszą pracę):

  • czy zdjęcia które macie wrzucić na stronę otrzymujecie jako osobne pliki, czy wycinacie je z projektu?

Aplikacje, które wymieniłem w pierwszym punkcie pozwalają bez problemu wyeksportować dowolny fragment projektu jako obrazek (jpg / png / svg / webp).


  • czy otrzymujecie od UX/UI informacje jak się nazywają poszczególne czcionki, czy musicie szukać jakiś podobnych?

Przy zaznaczeniu konkretnej warstwy można sprawdzić jak jest zbudowana (wysokość, szerokość, tło, kolor czcionki, wielkość czcionki, wielkość interlinii itd)

screenshot-20230529220912.png


generalnie jakiego zestawu informacji potrzebujecie by wykonać swoją prace?

Zazwyczaj przy prostych projektach dostaję jedynie link od grafika do projektu i tyle mi wystarczy do szczęścia. Jeśli wszystko zrobił dobrze, zgodnie z wytycznymi to nie mam potrzeby nawet z nim rozmawiać :D

0
Xarviel napisał(a):
Michał Jasiński napisał(a):

Niemniej ciekawi mnie jak wygląda praca Frontend Dev-a. Chodzi mi o ogólną koncepcję, ogólne informacje bez wchodzenia w szczegóły

Żeby się o tym przekonać to najprościej byłoby przejrzeć jak wyglądają obecnie projekty graficzne w Figmie, "Adobe XD", lub Sketch'u.
Mogę podrzucić przykładowy projekt w figmie (https://www.figma.com/community/file/1239767732969254476) tylko z tego co kojarzę to trzeba mieć założone konto, aby go wyświetlić.

Działa bez logowania.
Rozumiem, czyli projekt podzielony jest na warstwy. Sprytnie :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1