Internetowe wizytówki – minimalizm w stronach www

Niedawno znalazłem chyba najbardziej minimalistyczną, a jednocześnie w pełni funkcjonalną osobistą stronę www. Należy ona do twórcy pewnego zestawu ikon. Oto ona (Pen & Think):

To wszystko. Nic więcej. Pierwszy link prowadzi do mapy Google, drugi do strony Google dla pracowników, trzeci to link do konta Flickr, czwarty do Twittera, piąty na stronę z ikonkami, a szósty do formularza kontaktowego stworzonego jako dokument Google Docs.

Pomyślałem, że to rozwianie genialne w swojej prostocie. Nie zawsze trzeba się silić na specjalną stronę. Większość naszej obecności w sieci to tzw. “life stream”, czyli wpisy na blogach, komunikatorach, zdjęcia w galeriach (w większości doskonale zastępujących własną stronę www). Skoro tak, to dlaczego w przypadku, gdy ktoś jednak chce mieć własną storonę, to nie potraktować jaj jako agregatora innych używanych serwisów. Okazuje się, że istnieją już serwisy prezentujące takie podejście i umożliwiające stworzenia własnej wizytówki:

• Hi, I’m – your nametag on the internet (oferuje adres hi.im/nazwa i pokazuje najświeższe dane z posiadanych kont w serwisach takich jak Twitter, Flickr, LinkedIn, Digg, Youtube, LastFm)
• Create online business card – card.ly (oferuje adres card.ly/nazwa)
• Hover (serwis przekierowujący do innych serwisów pod adresem nazwa.hover.com)

Oczywiście podobne strony można stworzyć samemu, we własnej domenie. Galeria kilkunastu takich stron jest dostępna w serwisie Design Meltdown:

• Design Meltdown § Business Card

CSS3 – stylowy rozwój

Wielu z projektujących serwisy WWW od lat boryka się z urozmaiceniem ich strony wizualnej, bez nadmiernego przeładowania kodem i grafiką. Niestety nawet tak drobne efekty jak cień, zaokrąglenie narożników, czy przezroczystość elementów musiałby być tworzone za pomocą elementów bitmapowych lub JavaScript.  Odpowiedzią na te problemy jest kolejne wcielenie standardu CSS, czyli CSS3. Poniżej przedstawiam dwa ciekawe linki z przykładami co można zrobić dzięki CSS3 (póki co tylko w kilku najnowszych przeglądarkach):

• 11 Classic CSS Techniques Made Simple with CSS3
• CSS3 . Info – All you ever needed to know about CSS3

Są wakacje

Polski design i wzornictwo przemysłowe

Zainteresowała mnie ostatnio problematyka projektowania, designu, wzornictwa przemysłowego i szeroko rozumianych wizualnych aspektów produkcji i marketingu. Okazuje się, że mimo wielu chlubnych tradycji, polskie wzornictwo dopiero walczy o należną mu pozycję i całkiem niedawno powstały organizacje mające na celu promocję projektantów i ich dokonań. Poniżej przedstawiam zestaw ciekawych linków na temat wzornictwa, jaki znalazłem, przeszukując polskie zasobu sieci:

• 2+3D grafika plus produkt | Kwartalnik projektowy
• nowe rzeczy – rzeczy: o dizajnie
• SPFP – Stowarzyszenie Projektantów Form Przemysłowych
• STGU – Stowarzyszenie Twórców Grafiki Użytkowej
• Instytut Wzornictwa Przemysłowego
• Śląski Zamek Sztuki i Przedsiębiorczości w Cieszynie
• purpose przedsiębiorczość w kulturze
• LabDesign – wzornictwo przemysłowe, laboratorium design, sztuka użytkowa, modelarnia
• arena DESIGN

Prezi – koniec syndromu PowerPointa

Linearny, przewidywalny styl prezentacji w PowerPoincie i innych typowych programach prezentacyjnych odcisnął swoje piętno nie tylko na stylu przekazywania informacji biznesowej, czy akademickiej, ale nawet na przyzwyczajeniach komunikacyjnych. Zaczynamy myśleć niepełnymi zdaniami i wypunktowaniami.

Od dłuższego czasu próbuję znaleźć narzędzie pozwalające na ciekawą, nielinearną prezentację myśli, projektów i innych treści. Takie narzędzie nareszcie powstało. Nazywa się Prezi i jest opartym o Flash, intuicyjnym systemem tworzenia prezentacji online i offline (prezentację można zgrać na dysk, razem z programem do odtwarzania). Tworzenia prezentacji w Prezi to praca z tekstem, grafiką i ich zblokowaniami, oparta o pomysł płynnego przybliżania i oddalania treści oraz przepływów między elementami wirtualnej tablicy. Trudno to wytłumaczyć, radzę spróbować samemu. Jedyny mankament narzędzia to, że w wersji darmowej umieszcza ono swoje ogromne logo w prezentacji.

Czerwony Kapturek w wersji infograficznej

Jakiś czas temu pisałem o infografice, czyli sztuce przekazywania informacji obrazem. Dzisiaj chciałbym Wam pokazać infograficzną wersję bajki o Czerwonym Kapturku. W sam raz dla dzieci społeczeństwa postinformacyjnego.

Wycinanki, czyli kanciasta sztuka

Pamiętacie wycinane serwetki, modele z kartonu i inne cuda, które można wykonać dzięki odrobinie papieru, nożyczkom i klejowi. Są ludzie, którzy wycinanki przenoszą na wyższy poziom.

Serwis “Cubeecraft” umożliwia pobranie szablonów do wycinania i sklejenia rożnych postaci.

Z kolei Bert Simmons idzie o krok dalej, tworząc realistyczne, papierowe rzeźby-portrety osób.

Nie oceniaj książki po okładce – Dlaczego nie?

Pisałem już o pierwszych stronach gazet z całego świata w notce “Ciekawy serwis: Newseum – Today’s Front Pages” oraz o pierwszych minutach filmów i seriali, czyli sztuce sekwencji tytułowych (“Ispirujących kilka pierwszych minut“). Dzisiaj chciałbym Wam polecić serwis prezentujący dokonania w zakresie projektowania okładek książek. Okładki książek, obok plakatów, są chyba najciekawszymi przykładami powszechnego i użytkowego wykorzystania projektowania graficznego. Zachęcam więc do obejrzenia serwisu “The Book Cover Archive“.

A oto jak można artystycznie przetworzyć okładki książek - Thomas Allen’s Book Art Photography.

iPlotz – modelowanie i tworzenie prototypów stron www

W nawiązaniu do notek “Praca grupowa nad dokumentami i grafiką” oraz “Jak współpracować zdalnie z klientem?” oraz innych rozważań na temat ułatwienia sobie procesu twórczego i współpracy z klientem przy tworzeniu nowego serwisu www, chciałbym dzisiaj przedstawić serwis Iplotz. Umożliwia on nie tylko nanoszenie komentarzy i uwag na istniejące projekty graficzne, ale też tworzenie prototypów wyglądu stron z gotowych elementów. Całkiem ciekawy pomysł do zgrubnego projektowania layoutu i innych elementów interfejsu.

RSSy po swojemu

Jakiś czas temu w notce “Ciekawe serwisy: RSS inaczej” opisywałem rożne serwisy pokazujące w niestandardowy sposób podane RSSy lub wiadomości ze świata. Dzisiaj chciałbym pokazać kilka narzędzi, ułatwiających regularne czytanie wiadomości z ulubionych serwisów. Szczerze mówiąc, z powodu masy wyskakujących reklam na portalu gazety.pl i innych popularnych gazet, wiadomości ze świata mam zamiar czytać tylko przez niezaśmiecone kanały RSS.

Pierwszy serwis to xFruits, który po zarejestrowaniu pozwala tworzyć rożne agregacje kanałów RSS, do postaci nowego kanału, strony www, e-maila, pliku PDF lub na własnego bloga. Spodobał mi się z powodu mnogości opcji i prostoty użytkowania. Można w nim przykładowo złączyć kilka ulubionych RSSów w jedną stronę WWW i traktować jako osobisty dziennik, bez konieczności odpalania czytnika RSS.

Sokoro o osobistych dziennikach mowa, to ciekawym przykładem jest serwis Tabbloid, który na podstawie wpisanych RSSów generuje nam elegaancką gazetkę w postaci pliku PDF, wysyłanego na nasze konto pocztowe co tydzień lub codziennie. Jeżeli ktoś czyta kanały nieregularnie i chciałby sobie poczytać je na laptopie w drodze do pracy to całkiem ciekawa opcja.

Do rożnych kombinacji z zawartością stron WWW, RSSów, XMLów itp., służy serwis Dapper: The Data Mapper.  Jeszcze nie rozpoznałem jego możliwości, ale wygląda na to, że można za pomocą tego serwisu generować dowolne strumienie i wyciągi informacji, z dowolnych źródeł.

Ciekawe, że RSSy w pewnym sensie znacząco zmniejszaję istotność oprawy graficznej stron. Sczególnie tych z wiadomościami lub blogami. Wygląda na to, że teraz trzeba dbać nie tylko o oprwę graficzną całej strony, ale i odpowiednią ilustrację poszczególnych wiedomości (zdjęcia, rysunki, infografiki).

CMS dla każdego i bez instalacji

Jakiś czas temu pisałem o tym, jak ułatwić sobie współprace z klientem, dla którego tworzy się stronę www. W notce “Ciekawy serwis: Jumpchart” przedstwaiłem darmowy serwis, w którym można w stosunkowo prosty sposób stworzyć szkielt serwisu www i wpełnić go treścią, a następnie przesłać taki surowy materiał do opracowania strony graficznej. Kolejnym problemem na jaki napotykamy tworząc dla kogoś stronę www jest jej późniejsza aktualizacja. Jeżlei nie chcemy byc nagażowani przez własciciela strony przy każdej poprawce tekstu, czy inne zawartości serwisu, warto zainwestować w system zarządzania treścią, czyli CMS (ang. Content Management System). Nie zawsze mamy jednak możliwość jako zainstalowania, albo po prostu nie jesteśmy biegli w konfiguracji tego typu systemów.

W takim przypadku z pomocą przychodzą dwa niezwykle ciekawe serwisy, pozwalające za darmo i każdemu edytować zawartość dowolnej strony. To systemy CMS działające jako aplikacje webowe, których nie trzeba instalować i można korzystać z nich zdalnie.

Pierwszy z nich to TypeRoom Lite, serwis który umożliwia edytowanie zawartości dowolnej strony www, której adres wpiszemy na stronie startowej serwisu. Następnie taką stronę, łącznie z dodanymi do niej elementami, można zaktualizować przez FTP (trzeba znać oczywiście hasło do serwera, na którym jest ona umieszczona, więc jest to opcja raczej dla samych webmasterów), można też wysłać mailem np. na adres webmastera, który zadba już o publikację zmian, albo sciągnąć sobie poprawioną wersję na swój komputer i przekazać osobie odpowiedzialnej za utrzymanie strony (ściągnięte strony zachowują w swoim kodzie oryginalny układ odwołań i katalogów).

Drugi serwis idzie o krok dalej. CushyCMS jest pełnowartościowym CMSem, oczywiście też dziłąjącym zdalnie, ale to projektant srony decyduje kto i co może zmieniać (klient loguje się na swoje specjalne konto, z przydzielonym zakresem stron do edycji), a co ważnijsze jakie elementy strony można zmieniać (edytowalne obszary strony oznaczane są przez class=”cushycms”). Dzięki takiemu rozwiązaniu, system można ustawić tak, że np. nagłówki i tekst wprowadzajćy na stronie może być niezmienny, a dział z aktualnościami już tak.

Sądzę, że warto się zainteresować oboma rozwiązaniami, jeżeli chcemy przerzucić część prac edycyjnych na właściciela strony, jednocześnie zapewniając sobie kontrolę nad ich efektami. Nie ma bowiem nic gorszego niż domorosłe próby aktualizacji stron, kończące się koszmarkami edycyjnymi, a nawet zniszczeniem całego projektu.

Kopiuj wklej

Nie wiem jak Wy, ale ja miewam problem z znakami specjalnymi dostępnymi w HTMLu. Czasami potrzebuję strzałki, kropki lub krzyżyka. W tym momencie przychodzi z pomocą strona, gdzie sporo popularnych znaków specjalnych jest umieszczona wprost do kopiowania.

• ⌘C ⌘V Character

Jak powstaje strona (druk vs. www)

Specjalnie dla tych wszystkich, którzy nie widzieli jak wygląda praca specjalisty od DTP lub projektanta www zniesmaczam dwa poniższa filmy.

Projektowanie strony dla magazynu drukowanego.

Projektowanie strony www.

A dla tych wszystkich, którzy lubią filmy szkoleniowe polecam ten zestaw linków z odnośnikami do screencastów dotyczących projektowania stron www:

• 30+ Eye-Opening Web Development Screencasts

Drukowanie ze stron www tylko wybranych elementów

Na serwis PrintWhatYouLike natrafiłem już jakiś czas temu, ale nie sądziłem, że mi się przyda. Idea jego działania polega na tym, że wczytuje on podaną przez użytkownika stronę www, z której można następnie wybrać konkretne elementy do wydrukowania. Myślałem, że do takich celów wystarczy standardowa opcja “Drukuj zaznaczenie”. Okazało się jednak, że serwis może być niezwykle przydatny. Dzisiaj bowiem natrafiłem na stronę, na której drukowanie selekcji nie wychodziło, a poza tym chciałem wydrukować elementy oddalone od siebie i inną czcionką.

Serwis PrintWhatYouLike umożliwia wybranie dowolnych elementów ze strony, ich separację do odrębnego dokumentu, zmianę i powiększenie czcionki, usunięcie tła i obrazów. Na dodatek wynik takich działań można zapisać jako plik HTML lub PDF.

Jak zaprojektować logo?

Chciałbym dzisiaj przedstawić garść przydatnych linków, które obrazują proces powstawania loga, czy też logotypu.

• 17 Designer’s Logo Making Processes

Z tej samej strony pochodzi też zbiór linków do szablonów i generatorów logotypów dostępnych w sieci.

• Logo Templates and Generators

Szczególnie interesujący wydaje się zbiór elementów wektorowych do darmowego wykorzystania z LogoTemplater.com oraz ciekawy generator logotypów z LogoYes.

Inspiracji do projektowania loga warto natomiast szukać w serwisie FAVEUP, który kolekcjonuje ciekawe przykłady logotypów, wizytówek i stron www z całego świata.

Na koniec warto zajrzeć na stronę oferująca ogromny zbiór linków dotyczących projektowania logotypów:

• The Ultimate List of the Top Best Logo Design Resources