[layout] na portfolio Opcje

[Posio]

Jako iż skończyłem niedawno mój 5 większy projekt, pomyślałem, że mogę zacząć tworzyć powoli własne portfolio.
Stworzyłem coś jak dla mnie bardzo minimalistycznego ( co właśnie lubię ) Z resztą, sami oceńcie.

Co ew. zmienić ? Poprawić ? Dodać ?

W konwencji mam oczywiście wrzucenie tam troche JS na hovery itp. (np w menu, widoczny będzie tylko trójkącik pod aktywną stroną).

Przedstawiam oczywiście tylko ogólną konwencję, bo wiadomo, że do tego dojdą formularze z przyciskami, pewnie ikonka społecznościowa G+ itp.

(IMG:http://waski.tk/waski-port-min.jpg)

Ten post edytował Posio 5.03.2013, 20:42:25

[aras785]

Bardzo mi się podoba (IMG:style_emoticons/default/smile.gif)

[Spawnm]

Niby ładne, ale wygląda jak ulotka visual studio.
Jak byś robił w .net to by pasowało.

[Posio]

@UP
Rzeczywiście, mi też zalatuje to .NET i w ogóle współczesna stylistyką MS'u. Być może to dlatego, że nie mam nic przeciwko minimalistycznym napisom, wyraźnym, prostym i barwnym fontom i kafelkom. W żaden sposób co prawda się tym nie inspirowałem, wyszło to trochę podświadomie. Jeśli to możliwe, proszę o więcej opinii, zanim zacznę kodować szablon.

Ten post edytował Posio 6.03.2013, 11:14:58

[!*!]

W stylu microsoftu... Gdyby ciachnąć to w połowie, to część po lewej jeszcze ujdzie, ale ta po prawej już nie. Dopracuj typografię, może inne kolory, tło pod tym "dialogiem" i samo tło, kafle i top jest mdłe.

pewnie ikonka społecznościowa G+ itp.

a fe.

Ten post edytował !*! 6.03.2013, 11:46:02

[Pulpetto]

Całoś ładnie wygląda ale wg. mnie całość rozprasza wzrok... Jakoś nie mogłem się skupić na początku przez chwilę na żadnym konkretnym elemencie, doczytać tekstu czy zrozumieć o co chodzi (IMG:style_emoticons/default/tongue.gif) Pomijam, że wygląda jak plakat promujący jakąś konferencję właśnie wspomnianego MS (IMG:style_emoticons/default/tongue.gif)

[r4xz]

Sprawdziłbym z inną interlinią (większą) oraz pokombinował z czcionką.

Jeszcze te trójkąty w menu do mnie nie przemawiają (Może wrzucić tekst biały na ciemnym tle? Choć to może dziwnie wyglądać, też sprawdź (IMG:style_emoticons/default/tongue.gif) )

ale ogólnie pozytywnie, wzrok skupiłem najbardziej na "Get your X offer" (IMG:style_emoticons/default/wink.gif)

[Posio]

Ok, widzę, że szablon się w miarę podoba mimo iż jest to tylko poglądówka. Proszę o chwilowe wstrzymanie się z opiniami.Do weekendu albo w weekend wrzuce nową poprawioną wersję a poprawiam aktualnie:

-tło pod tekstem który ma służyć jako informacyjny (bardzo zwiększa czytelność)
-osadzenie treści ( mniej rzuca oczy na boki)
-poprawienie odstępów między wierszami
-test niosący informacje otrzyma standardową czcionkę.
-formularze + przyciski
-hover w menu (podkreślenie linią z gradientem)
-zmiana stopki (planuje lekki owal górnej krawędzi)

+ chyba najważniejsze WIECEJ PRZEKAZU - MNIEJ PI*RDOLENIA (IMG:style_emoticons/default/smile.gif)

planuje stworzyć to jako jedna stronę

portfolio, informacje, kontakt bez przeskakiwania ( slideTo )

[binprogrammer]

Fajne fajne, ale za bardzo przypomina reklamę visual studio


Ten post edytował binprogrammer 6.03.2013, 23:28:09

[Posio]

Cześć wszystkim. Wrzuciłem właśnie poprawioną wersję layoutu. Linki są te same co wcześniej (nadpisałem pliki na serwerze). Więc jeśli komuś cały czas wyskakuje stary layout, proszę o wyczyszczenie pamięci przeglądarki albo po prostu F5 ( też powinno zadziałać).

Proszę o kolejne oceny .

Ten post edytował Posio 10.03.2013, 12:33:46

[!*!]

Jest bałagan, wszytko się zlewa u góry, przez co formularz wygląda ubogo. Nadal widać ulotkę MS i trochę kanciasto, choć podobno teraz taka moda (IMG:style_emoticons/default/wink.gif)
btw. stosuj może prezentacje do standardu 1024x800, 1200x1024 ? to w końcu nie idzie do druku.

[Pulpetto]

Jak dla mnie przy przykładowych projektach strzałki w bok sugerują, że przejdę na inną podstronę coś takiego. Raczej proponowałbym strzałki w dół na zwiniętym projekcie i w górę dla rozwiniętego? (ew. plusik/minusik).

[r4xz]

To jest chyba wersja dla niedowidzących (formularz kontaktowy ledwo mi się mieści na ekranie)?

Ogólnie wygląda to tak: ktoś robił top... a potem przyszła druga osoba (niedowidząca) i dodała całą resztę. Zmiany na minus jak dla mnie.

[!*!]

Tak mi się jakoś skojarzyło: http://designmodo.com/demo/flat-ui/

[Posio]

@r4xz

Przyznaje, skalowanie jednych obiektów do drugich mi zbytnio nie wyszło. Podkreślam, że jest to poglądówka, na bazie której mam zamiar to dopiero kodować. Wszystko jest takie duże bo... bo nie wiem. Tak jakoś wyszło (IMG:style_emoticons/default/smile.gif)

ps. To z niewidzącą osobą mnie rozbawiło (IMG:style_emoticons/default/smile.gif) - przyznaje racje.

@!*!

No jest podobne ale chyba wszystkie style bazujące jakoś na stylistyce MS'u sa jakoś do siebie podobne czyż nie ?
Wolę prostotę i czystość aniżeli zaokrąglenie. Nie mam zbytnio duszy artysty, dla mnie wszystko musi byc proste i czytelne.

[Pulpetto]

Przyznaje, skalowanie jednych obiektów do drugich mi zbytnio nie wyszło. Podkreślam, że jest to poglądówka, na bazie której mam zamiar to dopiero kodować. Wszystko jest takie duże bo... bo nie wiem. Tak jakoś wyszło (IMG:style_emoticons/default/smile.gif)

To ja Ci życzę powodzenia... No chyba, że tak Ci jest wygodnie albo jesteś na tyle szalony żeby bawić się grafiką, a później się na niej prawie nie wzorować...

Osobiście zastanawiam się co chcę uzyskać w danym projekcie, jak ma to mniej więcej wyglądać, co to ma być. Później jest makieta - patrzę co i jak będzie działało, czy koncepcja sprawdza się tak jak bym tego chciał. Dopiero wtedy robię grafikę ale przy użyciu grid'a wiedząc jaki będzie rozmiar strony itd. Później jeszcze idzie design wg responsive itd. Natomiast tutaj to się nie trzyma kupy...

Powiem Ci tak: nie jestem artystą czy osobą zajmującą się grafiką ale mniej więcej wiem co i jak, a tutaj po tym ten lay po przeróbkach to wydaje mi się, że...
Wpadł Ci jakiś pomysł do głowy, siadłeś zrobiłeś zapytałeś o radę po czym siadła do tego zupełnie inna osoba, wrzuciła to do innego pliku i dorobiła dół... Trochę się to niestety nie trzyma kupy, a Twoje stwierdzenie, że to jest poglądowe do kodowania - jeżeli chcesz z tego kodować to powinieneś mieć już konkretną grafikę, zaryzykuję stwierdzenie, że co do piksela. Inaczej nawet najprostsza strona wyjdzie Ci rozjechana...

[Posio]

Szczerze to ten szablon / obrazek jest mi potrzebny tylko do pobierania pipetą kolorów, zachowania ogólnej konwencji, oraz zapoznania się z waszą opinią. Mając szablon dopasowany i zaplanowany co do pixela również mozna z niego zrobić rozjeżdżający się syf. Nie jest to jakiś wielki projekt w którym chcicąłbym analizować jak to on nie powinien być super intuicyjny itp. Ma się po prostu prezentować a jaki będzie wynik końcowy... wyjdzie w praniu.

[Pulpetto]

W takim razie....
Jak dla mnie projekt jest ok: jeżeli ktoś lubi tego typu motywy to mu się spodoba. Jednak miej na uwadze to, że Twoja strona na prawdę przypomina designem plakaty Microsoftu (IMG:style_emoticons/default/smile.gif)

[r4xz]

Szczerze to ten szablon / obrazek jest mi potrzebny tylko do pobierania pipetą kolorów, zachowania ogólnej konwencji, oraz zapoznania się z waszą opinią. Mając szablon dopasowany i zaplanowany co do pixela również mozna z niego zrobić rozjeżdżający się syf. Nie jest to jakiś wielki projekt w którym chcicąłbym analizować jak to on nie powinien być super intuicyjny itp. Ma się po prostu prezentować a jaki będzie wynik końcowy... wyjdzie w praniu.

Nie no, tutaj to całkowicie się nie zgodzę... takie rzeczy to można robić w aplikacjach (gdzie całość teoretycznie ogranicza się do wrzucenia uniwersalnego stylu), a nie na portfolio (IMG:style_emoticons/default/closedeyes.gif)
Łatwiej jest zrobić szablon w gimpie i tam go edytować, niż w HTML/CSS eksperymentować - w drugim przypadku możemy sobie włosy powyrywać jak wpadnie nam do głowy nowa "wizja artystyczna" i całą strukturę szlag trafi. Poza tym trzeba mieć jakiś plan działania aby ograniczyć ilość tagów (subiektywne zdanie - uwielbiam prostotę) i jak najlepiej stronę pod pozycjonowanie dostosować.

Swoją drogą - nie rozumiem tej całej mody na win8, jak na moje "każdy" na siłę próbuje to wcisnąć, a efekt jest jaki jest: wszystko duuuuuuuuże, paradoksalnie nieczytelne i pewnie jeszcze bez RWD (gdzie tutaj aż się o to prosi).

[Spawnm]

To że nadejdzie moda na strony w stylu w8, było oczywistym. Kiedyś robiono prostokątne strony, potem zaczęto wsadzać wszędzie gradienty. Wraz z kolejną modą zaczęto wszędzie dodawać border-radius przez co mieliśmy prawie okrągłe gradientowe strony www. Jako że moda musi się zmieniać to oczywistym było że z okrągłych poleci się w kanciaste z podstawowymi kolorami, bo moda lubi powracać (IMG:style_emoticons/default/wink.gif) Za jakiś czas pewnie znowu gradienty zasrają internet. Chyba że wszyscy rzucą się na strony 3D, ale to raczej zastąpi modę na migające flashowe kloce.

[Pulpetto]

Moda modą ale nie zawsze to co modne jest najlepsze...

Jest wiele ładnych i funkcjonalnych stron, które spełniają swoje założenia bez podążania z modą (IMG:style_emoticons/default/smile.gif)

[Generic]

To że nadejdzie moda na strony w stylu w8, było oczywistym. Kiedyś robiono prostokątne strony, potem zaczęto wsadzać wszędzie gradienty. Wraz z kolejną modą zaczęto wszędzie dodawać border-radius przez co mieliśmy prawie okrągłe gradientowe strony www. Jako że moda musi się zmieniać to oczywistym było że z okrągłych poleci się w kanciaste z podstawowymi kolorami, bo moda lubi powracać (IMG:style_emoticons/default/wink.gif) Za jakiś czas pewnie znowu gradienty zasrają internet. Chyba że wszyscy rzucą się na strony 3D, ale to raczej zastąpi modę na migające flashowe kloce.

Dokładnie. W świecie internetu panuje trend który zmienia strony z czasem. Jednak nie mogę uwierzyć że stare kwadraty okazały się nowocześniejsze od zaokrąglonych. Cóż kwadraty ładnie się prezentują i są nowoczesne za sprawą dobrze dobranych kolorów. Kolega którego cytuję podał tu swoją wizję kolejnego stylu, który będzie. Do gradientów raczej się nie powróci ale zanim pojawią się flashowe kloce ludzie będą bawić się w przezroczystości. Co do twojego layoutu to owszem jest to ładne lecz nie widzę tu możliwości od ucieczki przed porównywaniem do W8 bo faktycznie jest to w tym stylu wykonane. Nawet przyciski są identyczne. Musiałbyś zmienić cały wystrój żeby nie było to podobne. Osobiście wykonuję layout z kwadratami lecz aby odbiec od W8 musiałem postawić na to że nie będzie to tak ładnie się prezentować jak twoje. I tutaj widzimy problem z tym stylem (IMG:style_emoticons/default/smile.gif) . Pozdawiam.

Ten post edytował Generic 14.03.2013, 21:50:07

[Posio]

Ale czy mam przez te wypowiedzi rozumieć że bazowanie na stylu MS'u jest złe ? Od zawsze stawiam na minimalizm a taki właśnie jest nowy W8 do którego osobiście poza designem, przekonania nie mam.
Uważam ze bazowanie na tak znanych produktach jest dobre ponieważ wielu ludzi używających Windy poczuje sie jak w domu. Oczywiście nie rżnę kolorów bloków itp prosto z tego. Wszystko jest wykonywane według moich regół tyle że bazowy styl własnie jest oparty na aktualnym stylu który zapodaje nam MS. Póki co nie biorę się za kodowanie laya, bo dostałem drobne zleconka i troszke to wszystko się przedłuża... Ale prosze o kolejne opinie.

[Generic]

Wszystko prezentuje się w jakiejś formie. Strona jest oryginalna jeśli ma swój pomysł i design. Jeśli twoja strona to jakiś projekt na większą skalę to trzeba robić coś swojego. Takie strony jak facebook, twitter itd. nie mogą pozwolić sobie na takie wzorowanie się. Mają swoje pomysły, które tworzą przejrzystą i łatwą w obsłudze stronę. I tu właśnie masz przykład. Nie trzeba opierać się na dobrych i znanych projektach żeby zrobić coś dobrego. Równie dobrze w windowsie 8 zamiast kwadratów mogły się pojawić koła i zapewne tworzyłbyś stronę z kołami. Moim zdaniem lepiej wszystko wygląda i działa jeśli jest oparte na własnych pomysłach.

Ten post edytował Generic 15.03.2013, 21:32:44

[!*!]

No jest podobne ale chyba wszystkie style bazujące jakoś na stylistyce MS'u sa jakoś do siebie podobne czyż nie ?
Wolę prostotę i czystość aniżeli zaokrąglenie. Nie mam zbytnio duszy artysty, dla mnie wszystko musi byc proste i czytelne.

Nie chodziło mi o zwrócenie uwagi że jest to podobne, tylko np. mógłbyś pójść w takim kierunku jak tam... dobór barw, odcieni, styl.