Многие хоть раз задумывались о реставрации старых чёрно-белых фотографий. Большая часть снимков из так называемых мыльниц были переведены в цифровой формат, но так и не обрели красок. Решение проблемы перевода обесцвеченного изображения в цветное является очень сложным, но в некоторой мере доступным.

Превращение чёрно-белого фото в цветное

Если сделать цветное фото чёрно-белым просто, то в решение проблемы в обратном направлении становится куда сложнее. Компьютеру нужно понять, как именно раскрасить тот или иной фрагмент, состоящий из большого количества пикселей. С недавних пор этим вопросом занимается сайт, представленный в нашей статье. Пока это единственный качественный вариант, работающий в режиме автоматической обработки.

Colorize Black разработан компанией Algorithmia, занимающейся реализацией сотней других интересных алгоритмов. Это один из новых и успешных проектов, который успел удивить пользователей сети. В его основу заложен искусственный интеллект на основе нейронной сети, подбирающий необходимые цвета для загруженной картинки. Откровенно говоря, обработанное фото не всегда соответствует ожиданиям, но на сегодняшний день сервис показывает потрясающие результаты. Помимо файлов с компьютера, Колориз Блэк умеет работать с картинками из интернета.

• Сохранить изображение, разделённое фиолетовой линией пополам (1);
• Сохранить полностью раскрашенную фотографию (2).

Ваша картинка будет скачана на компьютер посредством браузера. В это выглядит примерно так:

Результаты обработки изображения показывают, что искусственный интеллект на основе нейронной сети пока не досконально научился превращать чёрно-белые фото в цветные. Однако он хорошо работает с фотографиями людей и более-менее качественно окрашивает их лица. Хотя цвета в примере статьи подобраны некорректно, всё же некоторые оттенки алгоритм Colorize Black подобрал удачно. Пока это единственный актуальный вариант автоматического преобразования обесцвеченной картинки в цветную.

В начале девятнадцатого века, когда человечество только изобрело фотографию, все фото были черно-белыми. Они выглядят таинственно и очаровательно. Несмотря на то, что в наше время можно делать высококачественные фотографии с широким спектром оттенков, черно-белые картинки все еще пользуются популярностью. К тому же, специалисты утверждают, что если трансформировать цветную фотографию в черно-белую картинку, можно скрыть мелкие дефекты и недостатки кожи. Давайте рассмотрим, как сделать фото в серых тонах с помощью программ Paint, Photoshop или сети Интернет.

Как сделать картинку черно-белой в Paint?

Paint – это один из самых простых редакторов изображения. Нет ничего сложного в том, чтобы с помощью этой программы преобразовать обычное цветное фото в черно-белое. Выполнить процедуру вам поможет нижеприведенная инструкция:

1. Так как Paint – стандартная программа на операционных системах Windows, вам не придется устанавливать ее. Достаточно открыть изображение в программе, нажав правой кнопкой мыши на картинку и выбрав пункт «Открыть с помощью Paint»;
2. На панели инструментов есть меню «Коррекция». Нажмите на него, и выберете пункт «Сделать черно-белым»;

Рис. 1

1. Чтобы сохранить преобразованное фото, нужны вкладки «Файл» и «Сохранить как»;

Рис. 2

1. Введите имя файла и выберите папку или место на компьютере, куда хотите сохранить фотографию.

Рис. 3

Как сделать фотографию черно-белой с помощью фотошопа?

В фоторедакторе Photoshop вы сможете сделать картинку или фото черно-белым в два счета. Для этого нужно, чтобы на вашем компьютере была эта программа. Если ее нет, сначала ее нужно скачать и установить на устройство, руководствуясь инструкцией. А чтобы преобразовать цветное фото в черно-белое, выполните следующие шаги:

1. Я предлагаю вам самый простой способ сделать картинку черно-белой в Фотошоп: обесцветить ее. Для начала загрузите фото в программу. После этого дублируем слой изображения, нажав следующую комбинацию клавиш: CTRL+G;

Рис. 4

1. На панели инструментов выбираем пункт «Изображение», далее «Коррекция» и в конечном итоге «Обесцветить». После этого цветное фото разукрашивается в оттенки черного, белого и серого;

Рис. 5, 6

1. Сохраняем фото на компьютер. Для этого на панели инструментов находим пункт «Файл» и выбираем «Сохранить как». Специалисты рекомендуют сохранять изображения в формате JPEG, так как картинки будут в четком расширении и сохранят полную гамму черно-белых оттенков.

Рис. 7, 8

Как сделать изображение черно-белым онлайн?

В сети Интернет есть множество ресурсов, которые позволяют преобразовать фотографию, в том числе поменять цветную гамму на черно-белую. Я выбрала сервис «Editor.Photo.to», который понравился мне простым и стильным интерфейсом. Ниже представленная инструкция, как с его помощью сделать картинку черно-белой:

1. Войдите на сайт, выберите пункт «Загрузить фото с компьютера» и откройте в редакторе фото, которое хотите отредактировать;

Рис. 9

1. Найдите раздел «Эффекты». Он находится на панели управления, слева;

Рис. 10

1. Примените эффект «Черно-белое». С помощью белого кружочка вы можете менять интенсивность цветов.

Рис. 11

Рис. 12

Как мы видим, нет ничего сложного в том, чтобы сделать цветное фото черно-белым. Для этого даже не обязательно иметь фоторедактор на компьютере.

Я думаю, что многие из Вас уже заметили, что сейчас в тенденцию входят всё больше липких элементов дизайна, которые остаются на виду при прокрутке страницы пользователем. Как по моему это очень удобно, особенно если это навигация сайта. Вот именно такой пример мы сегодня и будем делать. Мы узнаем как сделать анимированную шапку сайта на JQuery и CSS3 с анимацией.

Как обычно это, оказывается, делается в минимум строк кода и очень просто, и в то же время очень эффективно. Ну а теперь давайте приступим к уроку.

Но для начала хочется сказать огромное спасибо http://www.webdesignerdepot.com ну а теперь давайте точно начнём.

Ι

HTML

HTML код очень и очень простой, нам просто нужно задать теги для , и далее между ними написать содержимое сайта:

Так как это самый простой пример, тут мы добавили просто текст между тегами h1, но там также можно использовать изображения, или же, например, навигацию по сайту.

Код jQuery

CSS является самым лучшим способом реализации анимации и переходов в настоящее время. Так что скриптов мы будем использовать минимум, и то для того чтобы задать определение срабатывания анимации при прокрутке страницы.

Когда значение положения страницы при прокрутке больше чем 1, это означает, что пользователь прокрутил страницу и нужно добавить класс «sticky» к тегу шапки сайта. Таким образом срабатывает и фиксируется шапка сайта.

А вот и сам код:

$(window).scroll(function() { if ($(this).scrollTop() > 1){ $("header").addClass("sticky"); } else{ $("header").removeClass("sticky"); } });

Важно отметить, что использование в данном примере не очень хорошая затея, так как если в браузере будет отключено использование скриптов, тогда шапка сайта будет просто фиксированная и всё.

CSS

CSS код будет состоять из 2х частей. Первый код будет отвечать за стандартную шапку сайта, которая находится в положении по умолчанию. Второй код будет отвечать за отображение шапки, когда пользователь будет прокручивать страницу. Давайте посмотрим как выглядит код по умолчанию:

Header{ position: fixed; width: 100%; text-align: center; font-size: 72px; line-height: 108px; height: 108px; background: #335C7D; color: #fff; font-family: "PT Sans", sans-serif; }

Теперь самый интересный момент: когда пользователь прокручивает страницу вниз, тогда будет применяться класс.sticky, которому мы можем задать совершенно разнообразное отображение, на которое только способно CSS. Мы так же установим фиксированную позицию, что бы наша шапка сайта была всегда на виду.

С помощью этих CSS правил, которые ниже, мы хотим уменьшить площадь самой шапки при прокрутке, изменить цвет и конечно же уменьшить шрифт. Вот сам код:

Header.sticky { font-size: 24px; line-height: 48px; height: 48px; background: #efc47D; text-align: left; padding-left: 20px; }

Это самый простой пример, с помощью которого Вы должны понять суть работы. Всё зависит от конструкции Вашего сайта.

Ну а сейчас давайте добавим немного анимации нашему переходу с помощью . Вот код:

Transition: all 0.4s ease;

Ι

Заключение

Я надеюсь, что этот способ решит множество вопросов по поводу реализации удобной и простой навигации для сайта. К тому же данная реализация очень просто и понятна.