Rysownik.com - Odświeżenie wizerunku

Rysownik.com - Odświeżenie wizerunku

Jak już wcześniej wspomniałem na Facebooku, od jakiegoś czasu w domowych pieleszach, po cichu dłubałem sobie mój prywatny "rebranding" związany bezpośrednio z otworzeniem działalności gospodarczej. Lata mijają, a człowiek nie może przecież jechać wiecznie na studenckiej prezencji.

Problemem z marką Rysownik.com jest jej jednoznaczna nazwa, sugerująca śmieszne, tanie obrazki na wczoraj. Jak (nie) wiadomo jest to nieścisłością.

Od 4 lat pracuję w branży IT projektując interfejsy aplikacji internetowych. Są to rzeczy wymagające w większości ogarnięcia od strony informatycznej. Rysowanie zaś to moje hobby. Naturalne więc, że wizerunek rysownika wesołych obrazków słabo odzwierciedlał moje rzeczywiste umiejętności.

Nikt nie traktuje poważnie młodych ludzi

Kupując kilka lat temu fartem za złotówkę domenę Rysownik.com, nie myślałem z czym to się może wiązać. Google na tyle mnie polubiło, że szybko wskoczyłem na pierwsze miejsce w wynikach wyszukiwania pod frazą “rysownik”. I to bez zbytniej optymalizacji. Hurra, prawda?

No jednak nie. Internetowi marketingowcy wstrzymajcie proszę swoje konie, bo rzeczywistość nie jest taka różowa – nie w tej branży.

starefolio

Stare portfolio

Procent klientów, z którymi można nawiązać przyjemną i opłacalną współpracę spada, gdy przychodzą do Ciebie jako do “pierwszego z brzegu”, a nie konkretnie Ciebie. Gdybym był ślusarzem czy firmą od przeprowadzek – mógłbym się tylko cieszyć, ale gdy otrzymuję kolejnego maila pt. “Rysunek na koszulkę dla mojej dziewczyny”, zaczynam myśleć czy przypadkiem nie jestem zbyt “fajowy”. Z drugiej strony, dzięki domenie Rysownik.com klienci przychodzą w ogóle. Doświadczam tutaj dylemat godny przedsiębiorcy. Co zrobić?

Na przykład spoważnieć.

Logotyp

Rysownik.com Sygnet
showoff9
showoff4Wcześniejszy logotyp Rysownik.com był jedynie napisem, przygotowanym (zacnie) przez Filipa Komorowskiego. Brakowało jednak sygnetu, który by się kojarzył z moją kreską, ale też nie był zbyt dziecinny. Początkowo miała być czaszka, ale wywoływałaby negatywne skojarzenia, no i jest to emblem chyba nadużywany już w branży. Padło na… łezkę.

Czemu? Bo tak. Ale dla lubiących naciągane agencyjne tłumaczenia można powiedzieć, że to przelany pot i łzy pracy, tudzież ostatnia kropla krwi przelanej w walce o lepsze jutro.

Font

Rysownik.com Font Showcase

Krój pisma Twentieth Century Medium Condensed (zwany technicznie Tw Cen MT Condensed) dobrze wpisał się w minimalistyczną koncepcję całości. Problemem okazał się jedynie użytek na potrzeby WWW – musiał być obsłużony przez Fonts.com.

Kolory

kolo

Co do kolorystyki – znaczne stonowanie, względem do tego co było wcześniej. Przede wszystkim ograniczyłem nadużywany kolor żółty, który okazał się zbyt jaskrawy dla ludzi posiadających gorszej jakości lub gorzej skalibrowane monitory. Urok pracy na EIZO. Założenie jest takie, że to rysunki i projekty mają przykuwać uwagę kolorystyką, nie samo portfolio.

WWW i “Responsywny” design

Epoka szaleństwa Web 2.0 chyba już mija, ludzie zaczynają się opamiętywać i cenić minimalizm. Tablety i smartfony powoli przejmują rynek WWW – nie da się ukryć, postanowiłem więc wykorzystywać większą przestrzeń ekranu oraz skorzystać z kilku udogodnień na te urządzenia takich jak kafelkowe układy treści i wspomniany wcześniej design “responsywny”.Responsive Design

Nie jest to nowość, ale wypadało wdrożyć. Chodzi mianowicie o design WWW dostosowujący się do szerokości okna przeglądarki/urządzenia. O ile z treścią pojedynczych stron nie było kłopotu, problem pojawił się z wyświetlaniem działu Ilustracji – miniatury musiały być odpowiednio automatycznie dopasowywane – każda indywidualnie. W tworzeniu kafelkowych treści wykorzystałem jQuerowe skrypty Isotope oraz Infity Scroll.

Prawdziwym “pain in the ass” tradycyjnie już były wyświetlacze na mobilnych urządzeniach.

Przy okazji złączenia bloga z portfolio poprawiłem wszystkie stare teksty z literówek/błędów/zbytnich kolokwializmów i dorobiłem grafiki nagłówkowe bardziej dopasowane do nowej treści. Teksty na stronie są automatycznie łamane oraz czyszczone z sierotek na końcach wierszy, tak by maksymalnie poprawić jakość czytania (ciągle optymalizuję ten skrypt).

Cała strona działa teraz na WordPressie. Budowa skórki i związane z nią kodowanie – własnoręczna robota. Przydały się wcześniejsze doświadczenia z tworzeniem skórek pod ten CMS. Dużo czasu poświęciłem też optymalizacji strony pod Google, posuwając się nawet do “zboczenia” jakim są tagi Schema. Udało się też osiągnąć wyższe wyniki w benchmarkach Page Speed i YSlow, wasze przeglądarki podziękują mi za to.

Key Art

Na potrzeby nowej identyfikacji wykonałem także plakatową ilustrację. Przyda się do użytku w ramach tła i zapełniania przestrzeni. Dużo się na niej dzieje!

Key art black

Key art kolor

Key art detal

Key art detal

Do obejrzenia w całości w dziale Ilustracja.

Identyfikacja wizualna

Wizytówka

Wizytówka

Naklejki

- Komentarze -

titos2k ***

23.05.2013 / 15:47

3 2 1…poszło.

Seba

23.05.2013 / 16:48

Chwała za minimalizm, ale nie myślałeś żeby tył wizytówki zrobić taki? http://rysownik.com//wp-content/uploads/2013/02/keyartblack.png

Kumiko

23.05.2013 / 16:56

cały czas myślałam, że to czarna kropla tuszu! :D

Kamil

23.05.2013 / 23:13

W skrócie świetna robota. Początkowo myślałem, że oparłeś stronę na gotowym szablonie, bo jakoś umknęły mi twoje doświadczenia związane z webdesignem. Tym bardziej należą ci się oklaski.

Trochę późna pora na głębsze wyznania, dlatego powiem jedno. Twój blog należy do nielicznych, które odwiedzam regularnie. Bardzo bym chciał, żebyś pisał częściej, bo niektóre twoje spostrzeżenia zupełnie mnie rozbrajają. Np. “dla lubiących naciągane agencyjne tłumaczenia” – mnie też niesamowicie drażnią te górnolotne ideologie dorabiane do kółek stykających się tylko w jednym punkcie albo sprężyny ze złota, ale jednak mosiądzu – szczególnie często widywane na Behance swoją drogą.

Ibrachim

24.05.2013 / 15:32

IMO nie do końca teraz pasuje typo do znaku. Może zrezygnować całkowicie z niego i pozostawić sam sygnet, albo zastąpić je jakimś neutralnym krojem.

- Dodaj komentarz -

/ wymagany /
/ wymagany, nie będzie publikowany /