Коротенькая заметка о небольшом баге в Photoshop CC 2014, связанном с невозможностью узнать размер pattern’а.
В предыдущих версиях Photoshop все было проще - выбираешь в палитре слоев примененный образец и в окне “Pattern Overlay” достаточно навести курсор мыши на пример pattern’а. Появляется всплывающая подсказка, в которой видны размеры образца.
В Photoshop CC 2014 теперь таким образом невозможно получить подсказку о размере образцов изображения. Это баг или фича Photoshop CC 2014 - непонятно. Но жить стало труднее без такой возможности.
Однако, выход все же есть, хоть и через всем известное место. Решение таково.
Шаг первый - Pattern Stamp
В палитре инструментов выбираем инструмент Pattern Stamp:
Шаг второй - верхняя панель инструментов
Переводим взгляд вверх, на верхнюю панель инструментов (или как она там называется - неважно). На ней находим иконку окна Pattern Overlay:
Шаг третий - окно Pattern Overlay
Щелкаем мышкой по этой иконке. Появится окно Pattern Overlay со списком образцов изображений. Наводим курсор мыши на нужный образец и в появившемся tooltip видим размеры (момент появления tooltip я не заснял - но оно работает):
Заключение
Вот такую небольшую головоломку подкинули нам разработчики Photoshop. Но хоть и через заднее место, но выход все же есть.
Тема достаточно освещенная, но для меня, как новичка в мире Mac OS X - очередное маленькое открытие. Вопрос связан с одной небольшой проблемой - выбором файловой системы для флешек.
Для пары Windows + Linux обычным решением является файловая система NTFS. Обе операционные системы с ней прекрасно работают - чтение+запись.
Для пары Mac OS X + Linux такой выбор не подойдет, так как NTFS в Mac OS X имеет поддержку только чтения. Для записи нужно ставить сторонний софт, типа Paragon. Это не является решением - нужна нативная поддержка в обеих системах.
Решением является файловая система ExFAT. В Mac OS X у нее есть поддержка “из коробки”. В Linux поддержки “из коробки” нет - но проблема решается установкой дополнительных пакетов (как почти всегда).
Более того, в Сети пишут о системе ExFAT как изначально созданной для флеш-накопителей. Что она умеет бережно относится к флешкам и поддерживает размер более 4Gb.
Все отлично - ставлю ее на обе свои флешки: Apacer 8Gb и Transcend 16Gb. Начну с более сложного - с системы Linux.
ExFAT - установка в Linux
Для включения поддержки файловой системы в Linux нужно установить пару пакетов -
1
exfat-fuse
и
1
exfat-utils
:
Скажу, что приведенная выше команда на моей системе Linux Mint 17 Cinnamon оказалась действенной - все пакеты установились без проблем и поддержка ExFAT в системе появилась сразу же.
В Интернете почти на всех ресурсах приведена другая команда для установки пакетов
1
exfat-fuse
и
1
exfat-utils
(причем - один в один, перепечатывают друг у друга вслепую):
Однако, эта команда на моей системе не запустилась - выдала ошибку ключа при подключении репозитория
1
ppa:relan/exfat
. Именно этот факт и послужил для меня поводом написать этот краткий обзор.
Все - дело сделано. Теперь отформатирую флешку под файловую систему ExFAT в Linux.
Для этого сначала нахожу, где она расположена в файловой системе (в моем случае это устройство
1
/dev/sdb1
):
… и затем произвожу форматирование флешки командой:
где ключ
1
-n
- это задание для флешки имени как устройства.
Форматирование происходит буквально за пару секунд, ждать не придется. Первая флешка готова и операция форматирования выполнена под Linux.
ExFAT - форматирование под Mac OS X
Как уже говорилось мною выше, система Mac OS X имеет нативную поддержку файловой системы ExFAT. То есть, ничего дополнительно ставить не придется - все готово “из коробки”.
Операции по форматированию накопителей и другим действиям с жесткими дисками производится в стандартной утилите “Disk Utility”.
Вставляю вторую флешку и запускаю “Disk Utility”:
Разобраться с работой этой утилиты нетрудно, но вкратце опишу.
Слева находиться окно со всеми подключенными дисками, которые утилита сумела обнаружить.
Справа на вкладке “Erase” производиться настройка и выполнение форматирования (в терминологии Mac OS X форматирование называется “Erase”). В списке “Format” выбирается нужная файловая система (кстати, выбор небогатый).
В списке “Name” выбирается диск, который будет форматироваться. Там же находиться одноименная кнопка “Erase” для запуска форматирования.
Ниже располагается информативное (я был приятно впечатлен объемом и качеством подачи информации в нем) окно, в котором можно увидеть всю информацию по подключенному диску. Внимательный читатель заметит, что флешка у меня уже отформатирована в ExFAT - обзор делал “по горячим следам”.
В принципе - и все. Осталось нажать кнопку “Erase” и моя флешка отформатируется под систему ExFAT.
Если ее открыть в Finder, то теперь мне будут доступны как чтение с нее, так и запись на нее.
Заключение
Вот так “неожиданно” я решил проблему совместимости флешки под Mac OS X и Linux. Более того, данная система ExFAT является разработкой Microsoft, поэтому с ее поддержкой в Windows вообще нет проблем.
А если учитывать обещанный создателями ExFAT бережный способ обращения с флеш-накопителями, то этому решению вообще цены нет.
В данном примере рассмотрим создание parallax с эффектом вертикального скроллинга. Это самый популярный вид parallax’а для страниц типа Landing Page.
Создавать эффект будет с помощью скрипта Parallax.js. По странному стечению обстоятельств данный скрипт имеет точно такое же имя, что и скрипт из предыдущего примера - “Parallax.js - создаем простой parallax”. Однако, это разные скрипты и авторы у них разные; данный скрипт расположен на странице GitHub по адресу - Parallax.js.
Разметка для скрипта Parallax.js проста. Это обычный блок, который может быть
1
div
,
1
section
или что-либо еще. Обязательным условием является подключение для блока класса
1
class="parallax-window"
и двух data-атрибутов:
1
data-parallax="scroll"
и
1
data-image-src="images/one.jpg"
.
Второй атрибут в качестве своего значения имеет относительный путь к файлу изображения, которое будет устанавливаться в виде фона. В дополнение можно задать еще несколько атрибутов для ускорения загрузки изображений браузером:
1
data-natural-width
- реальная ширина изображения
1
data-natural-height
- реальная высота изображения
Ниже приведу созданные мною четыре блока
1
section
с содержимым:
Parallax.js - стилизация страницы
Стилизацию страницы буду выполнять на Sass/Compass с использованием вертикального ритма “Vertical Rhythm” - в данном случае он подойдет как раз к месту, как мне кажется:
В этом коде наиболее важными строками являются две - без них скроллинга не получиться:
Parallax.js - добавление Javascript
Разметка и стили готовы - осталось подключить скрипт Parallax.js и библиотеку jQuery:
jQuery “забираем” с Google, а скрипт Parallax.js - с GitHub-страницы проекта - Parallax.js. Все это “добро” пихаем в самый низ, подвал HTML-документа - перед закрывающим тегом
1
</body>
.
В дальнейшие украшательства вдаваться не буду - это дело техники. Мне важен сам принцип создания parallax с эффектом вертикального скроллинга.
В принципе, у меня все готово для того, чтобы полюбоваться результатом. Открываю страницу в браузере и любуюсь (не забывая скролить саму страницу):
Отлично! Получился прямо таки совсем неплохой parallax с вертикальным скроллингом. Готовый пример со всеми исходниками можно посмотреть на GitHub - Parallax.js Scrolling.
Небольшой обзор новой для меня темы - создание эффекта
1
parallax
на странице сайта. Вместе с вами буду учиться создавать такой эффект и начну с самого простого - Parallax.js.
Чтобы посмотреть, что примерно мы должны в результате получить, посмотрим на домашнюю страницу этого проекта - Parallax.js. Исходный код скрипта и документация расположена на GitHub - Parallax.js
Кратко о parallax
Что такое
1
parallax
как эффект сам по себе, хорошо видно на самой страничке и расписывать его я не буду. В Интернет есть лучшее и более подробное описание эффекта
1
parallax
. Единственное, что можно сказать по поводу
1
parallax
- появился он в основном как необходимость, дань моде. Своим существованием практически полностью обязан популярным на сегодняшний день
1
landing page
и призван скрасить и разнообразить их относительную монотонность.
Способов реализации
1
parallax
на сегодня сушествует множество. Но практически все они основаны на одном принципе - изменении скорости прокрутки фонового изображения на странице относительно других объектов на ней (поправьте меня, если я неправ).
Одним из преимуществ метода на основе скрипта Parallax.js является то, что в этом случае не требуется библиотеки jQuery. Скрипт может работать и с ней, но ее присутствие совсем необязательно. Получается выгода в весе страницы и скорости ее загрузки в браузере.
Parallax.js - начальная разметка
HTML-разметка для нашего будущего
1
parallax
удивительно простая - это маркированный список
1
ul
с идентификатором (имя его произвольное) и элементами списка
1
li
(имя класса обязательно и неизменно).
Еще одним обязательным атрибутом для элементов списка
1
li
является атрибут
1
data-depth
, у которого значение может меняться в диапазоне от 0 до 1. Чем выше значение в 1, тем выше скорость перемещения объекта на странице.
Внутрь элементов списка помещается изображение, которое будет анимироваться с помощью эффекта
1
parallax
.
Ниже приведен пример такой разметки:
Parallax.js - стилизация parallax
Произведем небольшую стилизацию нашего будущего
1
parallax
с помощью Sass/Compass. Для элемента
1
ul
добавим фоновое изображение, чтобы был лучше виден эффект parallax.
Parallax.js - добавляем javascript
Наш
1
parallax
почти готов - осталось “вдохнуть в него жизнь” с помощью Javascript.
Тут все просто. Первой строкой подключается файл скрипта Parallax.js. Второй строкой сначала в теле документа отыскивается элемент с идентификатором
1
scene
, который помещается внутрь переменной
1
scene
. Затем создается новый экземпляр
1
parallax
объекта Parallax и ему передается в качестве аргумента эта переменная
1
scene
.
Все - смотрим результат:
Достаточно подвигать мышью над фотографией красавчика на заднем плане, чтобы увидеть, как разноцветные кружки перемещаются с разной скоростью.
Мы получили эффект parallax.
Ниже приведен полный код HTML и CSS рассмотренного нами примера:
Полный исходный код примера можно посмотреть на GitHub - Parallax.js
С недавних пор (чуть больше двух недель) я стал счастливым обладателем Mac OS X. Если быть точнее - это iMac (21.5-inch, Mid 2014).
Неделю чувствовал себя не своей “тарелке” под ним, еще неделю привыкал. Потом все уже пошло по накатанной - система хороша, ничего не скажешь. Для работы - лучше не придумаешь.
Но речь в этой статье не о прелестях Mac OS X - их и без меня (с моими скромными талантами) превознесли до небес. Тема этой небольшой статьи - маленькое приложение Spectacle. Эта небольшая программка призвана улучшить-ускорить-облегчить работу в оконной среде Mac, служа в качестве менеджера этих самых окон.
Другими словами - Spectacle - это оконный менеджер для Mac OS X. Это приложение является не единственным в своем роде. Существуют еще программы - платная (и самая известная) - Divvy, также платная (стоит целых 2$) - BetterSnapTool и бесплатная - BetterTouchTool. Однако, Spectacle (в отличие от Divvy, которая стоит $13.99) - бесплатен.
Проживает программка по адресу - Spectacle. Домашняя страничка приложения очень проста - также, как и само приложение. Кстати, там же можно полюбоваться демо - что умеет делать данная программа.
Установка Spectacle
Установка программы Spectacle под Mac OS X стандартная. Скачиваем с официального сайта архив приложения, распаковываем его и перетаскиваем программку в папку “Applications”.
Настройки Spectacle
При запуске программы Spectacle она появиться в области индикаторов строки меню в виде значка:
При щелчке мыши на нем откроется длинный список загадочных клавиатурных сокращений. Эти сокращения можно редактировать, если открыть окно настроек программы:
Там же расположен checkbox - “Launch Spectacle at login” - думаю, все понятно и в переводе не нуждается.
Управление окнами с помощью Spectacle
Чтобы разобраться, что это за клавиатурные сокращения, достаточно пять минут поиграться с ними и все станет понятно. Выберем любое приложение (в моем случае это будет окно Terminal) в качестве подопытного кролика и будем нажимать hotkeys.
Следующие hotkeys заставят окно терминала занимать ровно половину экрана монитора, смещаясь при этом в нужную сторону:
занять левую половину окна — ⌥⌘←
занять правую половину окна — ⌥⌘→
занять верхнюю половину окна — ⌥⌘↑
занять нижнюю половину окна — ⌥⌘↓
Нижеследующие hotkeys заставят окно терминала “побегать” по углам экрана монитора. То есть, поместиться в нужный угол экрана, при этом размер окна останется без изменения:
сместиться в левый верхний угол — ⌃⌘←
сместиться в правый верхний угол — ⌃⌘→
сместится в нижний левый угол — ⌃⇧⌘←
сместиться в нижний правый угол — ⌃⇧⌘→
Еще пара полезных команд для управления окном:
окно программы по центру экрана - ⌥⌘C
окно во всю ширину экрана - ⌥⌘F
Программа Spectacle умеет перемещать окно приложения таким образом, чтобы оно занимало ровно треть площади экрана монитора. Сочетание - ⌃⌥→ заставит окно перемещаться сперва вертикально, а потом горизонтально по экрану, при этом занимая треть площади. Сочетание - ⌃⌥← заставит окно двигаться в обратном порядке. Попробуйте у себя - интересный эффект получается.
Изменение размера окна приложения достигается с помощью двух сочетаний клавиш:
увеличение размера окна - ⌃⌥⇧→
уменьшение размера окна - ⌃⌥⇧←
Перемещение окна между виртуальными дисплеями:
переместить окно на следующий дисплей - ⌃⌥⌘→
переместить окно на предыдущий дисплей - ⌃⌥⌘←
Очень полезной и приятной (а более того - нужной) особенностью Spectacle является то, что программа запоминает местоположение и размер окна для каждого приложения. В следующий раз, когда запуститься (например, у меня - окно терминала) приложение, его окно расположиться точно в нужном месте экрана монитора.
Если нужно сбросить настройки для окна проложения, то для этого существует комбинация - ⌥⌘Z. Вернуть обратно настройки для окна приложения - ⌥⇧⌘Z.
Заключение о Spectacle
Программа Spectacle мне понравилась однозначно. Первый фактор - она бесплатна. Второй - она (можно сказать) незаменима для удобной настройки workflow.
Первое упоминание об этой программе я увидел у Sorax. До этого пытался “подружиться” с Divvy, которую рекомендовали ребята из Loftblog. Однако, как-то не получилось у меня с ней работать.
А вот Spectacle понравилась с первого взгляда. Как мне кажется, из программа разряда “must have”.