Projektowanie na ekranie Retina: My Thoughts na Retina MacBook Pro

220, 5 pikseli na cal: szerokość 2800 i wysokość 1800, co daje w sumie ponad pięć milionów pikseli. To ekran, nad którym teraz pracuję, w pełnym wymiarze godzin. Rodzi to mnóstwo pytań: czy Apple ma jakąś firmę produkującą taki ekran? Czy to pomoże, czy utrudni przemysłowi? Czy naprawdę potrafisz nad tym popracować, jeśli projektujesz ekrany bez siatkówki?

Dzisiaj opowiem wam o moim doświadczeniu z maszyną, która grozi zmianą sposobu wykonywania pracy. Nic nie powstrzymam, gdy będę zachwycony tym, co uwielbiam, i rażę tym, co doprowadza mnie do szału. Czytaj dalej i sprawdź, czy zgadzasz się z moimi wnioskami.

Poznaj elementy Envato

Dang You Apple

W ostatnim dziesięcioleciu nasi projektanci koncentrowali się na tym, jak poradzić sobie z poważną zmianą paradygmatu w postaci coraz różnych rozmiarów ekranu. To wyzwanie rozciągnęło nas do końca, ale wyciągnęliśmy z drugiej strony lepszych projektantów, zdolnych do osiągnięcia imponujących wyczynów naprawdę elastycznych witryn, które świetnie wyglądają na dowolnym ekranie.

Mediaqueri.es prezentuje responsive web design, który świetnie wygląda wszędzie.

Chociaż skupiliśmy naszą uwagę na jednej zasadniczej zmianie paradygmatu, inna rzuciła się na nas: rezolucja. Dynamika tej zmiany pojawiła się ostatnio w Apple z wyświetlaczami o jakości „retina”, teraz obecnymi na iPhonie, iPodzie Touch, iPadzie i MacBooku Pro, a iMac i MacBook Air bez wątpienia pojawią się w następnym roku lub dwóch .

Apple może nie być pierwszym lub jedynym producentem elektroniki, który wypycha wyświetlacze o wysokiej rozdzielczości, ani też prawie nigdy nie są pierwszymi. Jednakże, czy im się to podoba, czy nie, historycznie wyznaczyli sobie znak powszechnego przyjęcia dużych zmian technologicznych (jest to część, w której pomijasz wszystko inne, co mówię, więc możesz orzec, jak bardzo nie jest to prawda w komentarzach).

Podobnie jak w przypadku rewolucji rozmiaru ekranu, projektanci mają do czynienia z ogromną zmianą paradygmatu, która zmienia wszystko. Przeszkoda ta może okazać się trudniejsza do pokonania niż poprzednia i wymaga naszej natychmiastowej uwagi i spekulacji. W marcu opublikowałem dyskusję na ten właśnie temat.

Od tego czasu kupiłem Retina MacBook Pro, maszynę, która wyłamała wyświetlacz siatkówki z małego, ładnego ogrodzonego ogrodem iOS systemu i wkroczyła w sferę czegoś, z czego ludzie ze wszystkich zawodów będą korzystać w pracy. Po tygodniach pracy na maszynie w pełnym wymiarze czasu pomyślałem, że warto podzielić się z tobą moimi doświadczeniami.

Czy ekrany siatkówki powinny jeszcze istnieć?

„Kiedy widzimy, że ekrany o dużej gęstości stają się coraz większe, zaczynam pytać, dlaczego? Tylko dlatego, że możemy? - John Carey
Pięćdziesiąt cieni

Czytałem ostatnio kilka artykułów z kreacji, które są naprawdę wściekłe na Apple za spychanie branży na tak kłopotliwą ścieżkę. Podobnie jak Ian Malcom, który oskarża Johna Hammonda o jego pochopną decyzję o przywróceniu dinozaurów z martwych, ci krytycy nalegają, że tylko dlatego, że Apple może stworzyć taki ekran, nie znaczy, że powinni .

Pewnego dnia z ekranem siatkówki przekonało mnie, że krytycy się mylą. To jest po prostu tak piękne. Już nie mogę znieść patrzenia na mojego starego MacBooka. Moje oczy zostały otwarte i nagle ten sam ekran, na którym nigdy nie miałem problemu z wyglądaniem wręcz ciemnym i błotnistym.

Czy powinniśmy zatrzymać się w magnetowidzie?

Jedynym sposobem, aby naprawdę docenić, jak to jest, nie doświadczając tego samemu, jest znalezienie starego telewizora CRT i podłączenie go do magnetowidu, aby móc obejrzeć film. Poważnie, spróbuj. W ciągu kilku sekund będziesz się zastanawiać, jak na świecie udało ci się przetrwać tak kiepskie wrażenia wizualne. Po dziesięciu minutach będziesz codziennie dziękować bogom technologii za wszechmocnego Blu-ray.

Przejście z taśm VHS było uciążliwe, ale patrząc wstecz, było warto.

Z perspektywy, którą mamy teraz, patrząc wstecz, lepiej zarówno klientom, jak i producentom z branży filmowej lepiej pozostawić taśmę VHS jako podstawową metodę reprodukcji i dystrybucji wideo. Czy rewolucja była niewygodna dla wszystkich zainteresowanych? Absolutnie.

Twórcy treści musieli się uczyć, adoptować, a nawet opracowywać zupełnie nowe sposoby robienia rzeczy. Klienci musieli porzucić stary sprzęt i mnóstwo treści, dokonać nowych zakupów, które wydawały się zbędne w stosunku do poprzednich, nauczyć się nowego żargonu; to był bałagan. I to tylko doprowadziło ich do etapu DVD, wielu wciąż przeskakuje na Blu-ray, a może nawet na czysto cyfrowe rozwiązanie, takie jak iTunes i Apple TV.

„Zaliczki nie są uzależnione od tego, czy przyniosą komuś niedogodność. Zwłaszcza, gdy Apple zajmuje miejsce kierowcy. ”

Pojawienie się przetwarzania w wysokiej rozdzielczości stwarza te same problemy, zarówno dla konsumentów, jak i twórców treści. Niestety tak działa branża technologiczna. Postępy są dokonywane, gdy istnieje na nich rynek, a wiedza technologiczna jest obecna, aby zapewnić jakość, na którą konsumenci mogą sobie pozwolić. Nie opierają się na tym, czy będą dla kogoś niewygodne. Zwłaszcza, gdy Apple zajmuje miejsce kierowcy.

I to dobrze. Jasne, może się to nie wydawać, ale pamiętaj, że kiedyś monitory komputerowe posiadały tylko garść kolorów i możesz się założyć, że w branży byli ludzie, którzy nalegali, aby nie iść dalej. Jestem pewien, że cieszycie się, że tak zrobili, więc przestańcie być jedną z osób, które ciągną kopanie i krzyczą do postępu, zamiast tego próbujcie atakować wyzwania i wnieść coś cennego do rozmowy.

Życie i praca na komputerze MacBook Pro Retina

„Wiedziałem, że będą pewne kłopoty i są”.

To, czy ekrany siatkówki powinny istnieć na głównym rynku, jest naprawdę nieistotną dyskusją. Tak, a ty masz dwie możliwości: przystosuj się lub zgiń. Jako były projektant, który był tylko do druku, stanąłem przed tym wyborem, programiści Flash stoją obecnie przed tym wyborem, równie dobrze możesz dołączyć do klubu.

Chodzi mi o adaptację, więc wybrałem pierwszą drogę adopcyjną i wskoczyłem do tego pociągu, zanim miałem pojęcie, dokąd zmierza. Zostawiłem swojego MacBooka 13 2007 z 2007 roku i kupiłem nowy błyszczący Retina MacBook Pro 15..

Wiedziałem, że będą pewne problemy i są. Niektóre z tych, o które się martwiłem, okazały się niczym wielkim, inne, na które nie liczyłem, że się podskoczyły i nękały mnie do frustracji.

Tysiąc Kapeluszy

Każdego dnia noszę kilka metaforycznych czapek. Jestem projektantem, pisarzem, fotografem, przeglądarką internetową, obserwatorem filmów; nazwij to.

Z tego powodu mogę zaoferować wgląd w wiele różnych doświadczeń z punktu widzenia wyświetlania siatkówki. Jedyną rzeczą, której nie jestem prawda, jest gracz. Dorastałem jako kontroler Nintendo i nigdy nie interesowałem się grami komputerowymi, więc będziesz musiał zapytać gdzie indziej, czy szukasz wglądu w tym obszarze.

Oto kilka głównych kategorii codziennego użytku i moje przemyślenia na ich temat.

Ogólne użycie systemu operacyjnego

Obecnie korzystam z systemu OS X Lion i wydaje się, że 99% jest zaktualizowany pod kątem grafiki siatkówki. Co jakiś czas łapię stronę przycisku, który wygląda na pikselowany, ale tylko w głęboko zakopanych narzędziach, z których i tak niewiele osób korzysta.

W przeważającej części to właśnie tam świeci wyświetlacz. Wszystko wygląda absolutnie oszałamiająco. Apple nie tylko zaktualizowało system podstawowy, ale także większość swoich aplikacji, takich jak iMovie.

Aplikacje innych firm

Ten obszar był problemem, kiedy kupiłem maszynę, ale okazało się, że jest to mniej znaczący problem, niż myślałem, że będzie.

Wiele z moich ulubionych aplikacji, takich jak Sublime Text 2, na początku wyglądało szorstko, ale otrzymałem już aktualizacje siatkówki, które sprawiają, że są lepsze niż kiedykolwiek.

To prawda, że ​​większość aplikacji nie została jeszcze zaktualizowana, ale pomimo tego, że jest uzależniona od aplikacji, naprawdę nie ma tak wielu aplikacji, z których korzystam na co dzień. Z wyłączeniem CS6, o którym będziemy rozmawiać później, jedyną aplikacją, z której korzystam każdego dnia, która naprawdę mnie wkurza, jest Twitter dla komputerów Mac.

Ta aplikacja naprawdę pokazuje nieprzyjemność grafiki bez siatkówki na wyświetlaczu siatkówki. Co ciekawe, tekst na żywo, edytowalny, taki jak ten, który pojawia się w oknie „nowego tweeta” wygląda dobrze, ale cały Twój strumień jest ohydny, od tekstu po awatary.

Przeglądanie stron internetowych

„To małe obrazy, które wyglądają źle. Małe logo JPG u góry strony, zrzut ekranu interfejsu… ”

Przeglądanie Internetu naprawdę mnie przeraziło. Wiedziałem doskonale, że sieć jest światem o niskiej rozdzielczości, a skierowanie na nią 15-calowego ekranu siatkówki jest jak zabranie szkła powiększającego do zdjęcia o niskim DPI.

Ku mojemu zaskoczeniu, przygotowaliśmy się na tę rewolucję wyjątkowo dobrze, nawet zupełnie przypadkowo. W obsesji na punkcie oszczędzania przepustowości poprzez tworzenie grafiki internetowej bez obrazów, budowaliśmy sieć, która jest nieskończenie skalowalna.

Większość interfejsu użytkownika w dzisiejszych czasach jest zbudowana ze starego, dobrego HTML, CSS i JavaScript. Rzucanie wyświetlaczem siatkówki na te grafiki tylko poprawia ich wygląd! Dla przypomnienia, tego samego nie można powiedzieć o witrynach Flash.

Prawdziwy problem oczywiście dotyczy obrazów. Co ciekawe, większość moich przeglądarek internetowych przechodzi bez jednego gniewnego spojrzenia, a ja jestem wariatem.

Profesjonalne zdjęcia szczególnie dobrze wyglądają. Wybierz się na Flickr lub 500 pikseli, a przekonasz się, że wrażenia są tak samo przyjemne jak zawsze, a może nawet bardziej.

To małe obrazy, które wyglądają źle. Małe logo JPG u góry strony, zrzut ekranu interfejsu, tak naprawdę nie mają zbyt wiele informacji do podwojenia pikseli i dlatego wyglądają dość żałośnie.

Filmy i programy telewizyjne

Retina MacBook Pro złomował swój napęd optyczny podobnie jak MacBook Air, więc oczywiście nie miałem żadnego doświadczenia z DVD, ale w większości filmy są jak obrazy. Świetnie wyglądają lepiej, a złe wyglądają gorzej.

Pobrane cyfrowo filmy HD świecą na ekranie, podczas gdy transmisje na żywo z Netflix / Hulu wyglądają wyraźnie postrzępione. Na szczęście odległość, z której zazwyczaj oglądam program, jest znacznie większa niż tam, gdzie pracuję, więc wszelkie problemy z rozdzielczością zwykle nie są tak zauważalne.

Fotografia

Ponieważ fotografuję aparatem Canon 5D Mk II, moje zdjęcia są ładne i duże. Wyglądają świetnie na wyświetlaczu siatkówki i nie miałem żadnych problemów z powiększaniem i edycją drobnych szczegółów. Jedynym prawdziwym problemem jest to, że oprogramowanie (Photoshop i Lightroom) nie zostało jeszcze upiększone przez siatkówkę, nawet w CS6.

Pisanie

Z czysto pisanego punktu widzenia ekran siatkówki jest zdumiewająco dobry. Typografia przy 220 pikselach na cal to piękna rzecz. Wciągam Writeroom, przełączam się w tryb pełnoekranowy i blokuję świat.

Po kilku godzinach łatwo zapomnieć, jak wygląda dobry typ. Jednak w ciągu kilku sekund od wyświetlenia dokumentu tekstowego na ekranie o niskiej rozdzielczości widzę tylko piksele. Brudne, brzydkie piksele.

Ten typ nie tylko dobrze wygląda na wyciągnięcie ręki. Mogę trzymać twarz tak blisko ekranu, jak tylko potrafią moje oczy, a typ nadal wydaje się ostry.

Typografia jest pięknie ostra na ekranie siatkówki.

Photoshop, projektowanie i zrzuty ekranu

Teraz pojawia się część, o której naprawdę chcesz usłyszeć: jak tam Photoshop? Czy możesz zaprojektować na tej rzeczy?

Projektanci iOS powinni uznać to za przydatne

Zacznę od stwierdzenia, że ​​nie jestem projektantem iOS. Ci faceci byli do tej pory zmuszeni do projektowania grafiki siatkówki na ekranach innych niż siatkówka i wyobrażam sobie, że chętnie dokonają zmiany.

Mam odwrotny problem: projektowanie grafiki innej niż siatkówka na ekranie siatkówki. Możesz nie oczekiwać, że to będzie ból, ale szczerze mówiąc, naprawdę tak jest.

Jest tak, ponieważ tracisz całą koncepcję rozdzielczości, gdy jesteś w niższym zakresie ppi. Mogę być w stanie zignorować małe, postrzępione obrazy podczas przeglądania, ale kiedy siedzę na krześle twórcy, mój mózg analizuje każdy piksel.

Pixel Doubled Artwork Sucks

„Aby właściwie sprawdzić, czy grafika jest na równi, muszę rzucić okiem na mój stary ekran”.

Na ekranie siatkówki wszystko, co tworzę lub importuję do Photoshopa w standardowej rozdzielczości internetowej, wygląda jak bzdura. Nawet jeśli zbuduję coś w wektorze, chyba że jestem skłonny wyeksportować go jako plik SVG, a przez większość czasu nie jest to opcja (jeszcze), nadal otrzyma dane wyjściowe do małego pliku JPG lub PNG, który wygląda na bardzo pikselowany, ponieważ mój ekran próbuje podwoić rozdzielczość.

To stwarza wiele trudnych problemów, zarówno gdy pracuję z własną grafiką, jak i innymi. Czy w przypadku mojej własnej kompozycji należy ją budować w niskiej rozdzielczości? Takie postępowanie pogarsza moją zdolność do oceny jego klarowności. A może powinienem zbudować go w wysokiej rozdzielczości i pomniejszyć na outpur? Nie jestem pewien, czy zauważyłeś, ale Photoshop może naprawdę zniszczyć grafikę rastrową podczas skalowania.

Jest to również problem, gdy używam grafiki innej osoby. Jeśli jesteś projektantem, prawdopodobnie zwykle otrzymujesz grafiki osób trzecich, które są gówniane i pikselowane. W konsekwencji albo zdecydujesz się żądać lepszego pominięcia grafiki, używając jej całkowicie.

Dla mnie jest to o wiele trudniejsze, ponieważ na pierwszy rzut oka zawsze będzie wyglądać źle na wyświetlaczu siatkówki, chyba że stanie się ogromny. Aby właściwie sprawdzić, czy grafika jest na równi, muszę rzucić okiem na mój stary ekran.

Zrzuty ekranu

„Nagle zrzuty ekranu, które robię, są dwukrotnie większe niż zamierzałem!”

Biorąc pod uwagę fakt, że zarabiam na życie, myślę, że bezpiecznie jest powiedzieć, że robię więcej zrzutów ekranu niż przeciętna osoba. Zawsze pracuję z zrzutami ekranu z interfejsu aplikacji lub strony internetowej i umieszczam je we wpisach.

Wyświetlacz siatkówki uderzył mnie tutaj nikczemnym łukiem. Nagle zrzuty ekranu, które robię, są dwukrotnie większe niż zamierzałem! Po zmianie rozmiaru zrzuty ekranu interfejsu użytkownika z grafiką rastrową i niewielkim tekstem wyglądają naprawdę paskudnie na każdym ekranie, dlatego zawsze staram się je wykorzystywać w 100%, jeśli to możliwe.

W przypadku ekranu siatkówki obraz, który kiedyś był zrzutem o szerokości 510 pikseli (standardowy rozmiar obrazu Design Shack), ma teraz szerokość 1020 pikseli. Jeśli całkowicie ignoruję użytkowników siatkówki i udaję, że ich nie ma, logika mówi, że powinienem wyświetlać obrazy o szerokości 510 pikseli, co oznacza, że ​​muszę ręcznie zmienić ich rozmiar w Photoshopie i pogodzić się z tym, że wyglądają tak, jakby byli po prostu przejechana przez ciężarówkę, szczególnie jeśli chodzi o tekst rasteryzowany.

Pamiętaj, że oczywiście wyglądają dla mnie gorzej niż większość użytkowników, ponieważ, zgadłeś, jestem na ekranie siatkówki.

Zmień swoją głupotę

Przedstawiłem dylemat zrzutu ekranu kilku różnym osobom, a one wszystkie mówią to samo: wystarczy zmienić rozdzielczość! To wydaje się być całkowicie wykonalnym rozwiązaniem, ale okazuje się, że nie jest to takie proste.

Retina MacBook Pro ma pięć różnych ustawień rozdzielczości. Oto, co się stanie, jeśli wybiorę dwie różne rozdzielczości, zrobię zrzut ekranu z tego samego dokładnego okna, a następnie przykleję je obok siebie w Photoshopie.

Jak widać, mają dokładnie taki sam rozmiar. Zmiana rozdzielczości w Preferencjach systemowych wpływa na ogólny rozmiar całego zrzutu ekranu, ale przez większość czasu elementy na ekranie są niezmienione.

Dla przypomnienia, oto ile tego okna mogę zmieścić w dokumencie o szerokości 510 pikseli w pełnym rozmiarze:

Jeśli tylko przekląłeś, to twoja reakcja była natychmiastowa.

Praca na jasnym, ostrym ekranie

„Spędzanie pół dnia na przeskakiwaniu między ekranem siatkówki a ekranem innym niż siatkówka dosłownie sprawiło, że poczułem się chory na morzu!”

Na moim starym MacBooku zwykle pracowałem z pełną jasnością. Czytałem mnóstwo rzeczy o żywotności baterii, zmęczeniu oczu i tym podobnych, ale nigdy nie podobało mi się to, jak wyglądało, chyba że jasność została zmieniona.

Na tym nowym ekranie pełna jasność jest absolutnie zbyt jasna dla większości scenariuszy oświetleniowych. Ekran siatkówki? Bardziej jak ekran spalania siatkówki. To jest świetne, ale wolałbym mieć zbyt jasny ekran, który należy odrzucić.

Co ciekawe, od czasu zmiany zauważyłem pewne bóle głowy. Ekran jest tak jasny i ostry, że można by pomyśleć, że będzie to łatwiejsze dla oczu, ale może istnieć punkt, w którym przesuwa się zbyt daleko i powoduje większe zmęczenie oczu niż oszczędza. Dopóki utrzymuję jasność pod kontrolą, nie sądzę, że będzie to poważny problem w perspektywie długoterminowej.

Ostrość ekranu była naprawdę tylko problemem pierwszego dnia, kiedy przenosiłem wszystko ze starej maszyny na nową. Spędzanie pół dnia na przeskakiwaniu między ekranem siatkówki a ekranem innym niż siatkówka dosłownie sprawiło, że poczułem się chory na morzu!

Rosnące bóle

„Wraz z nową technologią pojawiają się nowe wyzwania, a pierwsi użytkownicy, tacy jak ja, płacą cenę”

Oto pełna lista pochwał i skarg dotyczących mojego nowego komputera Retina MacBook Pro. Celowo ten artykuł koncentruje się bardziej na wyzwaniach związanych z pracą na ekranie siatkówki niż na korzyściach. Jeśli jestem całkowicie szczery, korzyści mnie zaskakują i nie żałuję mojego zakupu. Absolutnie uwielbiam ten komputer i nie zawaham się powiedzieć, że jest to najlepszy komputer, jakiego kiedykolwiek używałem.

Wszystkie zmagania, które wymieniłem powyżej, po prostu nasilają się. Wraz z nową technologią pojawiają się nowe wyzwania, a pierwsi użytkownicy, tacy jak ja, płacą cenę (w przenośni i dosłownie) w zamian za posiadanie nowych, błyszczących zabawek, których nikt inny nie ma.

Wiele lat później, gdy wszystkie nowe komputery osiągają 220ppi i mają dyski półprzewodnikowe jako standardowe komponenty, cena tej technologii będzie znacznie bardziej przystępna, a kary za korzystanie z niej prawie nie istnieją.

Porównanie rozdzielczości ekranu komputera z The Verge

Prawie każda skarga, którą wymieniłem powyżej, naprawdę sprowadza się do tego, że posiadam komputer z wyświetlaczem o wyższej rozdzielczości niż ludzie, dla których projektuję. Gdy wszyscy znajdziemy się na tej samej stronie, wszystko zostanie znacznie uproszczone.

Powiem jednak, że posiadanie urządzenia z ekranem o jakości siatkówki może zwiększyć Twoje poczucie pilności z powodu problemu z obrazem, z którym mamy obecnie do czynienia w Internecie. Chcesz, aby użytkownicy siatkówki mieli piękne zdjęcia, ale czy warto ładować czas ładowania dla użytkowników innych niż siatkówka? Na szczęście zaczynają pojawiać się naprawdę niesamowite rozwiązania, takie jak Retina.js, które złagodzą ten problem.

Nadal jednak, w niedalekiej przyszłości, w której musimy tworzyć i przesyłać dwukrotnie zdjęcia, do których kiedyś byliśmy, nie jest to coś, co może nas ekscytować, prawda?

Co myślisz?

Miejmy nadzieję, że ten ogromny rant nie był kompletną kupą bzdur. Miałem zamiar pomóc projektantom, którzy zastanawiają się, czy powinni kupić komputer Mac Retina, w podjęciu świadomej decyzji. Obecnie zbyt wiele źródeł wymienia tylko dobre lub złe i chciałem podzielić się wszystkimi swoimi przemyśleniami i pozwolić ci sam zdecydować, czy siatkówka Mac jest dla Ciebie odpowiednia.

Co o tym sądzisz? Jeśli nie kupiłeś jeszcze komputera z wyświetlaczem o jakości siatkówki, czy myślisz, że wkrótce to zrobisz? Dlaczego lub dlaczego nie? Jeśli tak, co o tym sądzisz? Czy poleciłbyś to innym?