Евгений Шевцов
Руководитель отдела дизайна ГК Юзтех
Каждую неделю свет видит новое приложение или стартап. Команды создают новые продукты или адаптируют старые механики под новые паттерны и реальности.
В этот раз энтузиасты перепридумали браузер. В социальных сетях ходило очень много шума по поводу браузера Arc, но доступ к нему выдают не сразу и не всем. Давайте посмотрим на него поближе и разберемся, действительно ли он революционный?
У меня на компьютере установлено несколько браузеров: Safari, Firefox Developer, Yandex и как основной — Google Chrome. Каждый раз, когда я запускаю какой-то не основной браузер, мне предлагают сделать его браузером по умолчанию, но я отказываюсь.
С Arc картина поменялась, теперь он браузер по умолчанию и сейчас я расскажу почему.
Работает браузер пока только на MacOS версии 12+, то есть Monterey и выше. Доступ к браузеру только по инвайтам, в статье есть ссылка на 10 приглашений в браузер.
Браузер работает на движке Chromium, поэтому все расширения доступны из Google Chrome.
Первый запуск и онбординг
Самое первое, чем меня лично покорил этот браузер — первый запуск, со свистом, музыкой и визуальными эффектами. Я испытал истинное эстетическое удовольствие.
Первое окно приветствия и регистрации браузера
Но красивых картинок мало, важна суть и функциональность.
ПКМ — Правая Клавиша Мыши.
Импорт закладок
Как и в любом стандартном браузере, Arc, предлагает нам импортировать закладки из своего любимого браузера.
Делать этого я, конечно же, не стал, решил начать новую жизнь в интернете и не тянуть в новенький браузер весь тот старый хлам, который я практически никогда не открываю.
Закладки уже позже я перенес руками, которые действительно важны.
Кастомизация интерфейса
Можно выбрать тему оформления браузера в светлых или тёмных тонах. А еще можно настроить под свой вкус: одиночный цвет, градиент, интенсивность заливки и шум фона.
Кастомизация в браузере Arc
Избранное
На этапе онбординга, браузер предлагает добавить в избранные закладки несколько сервисов, вы можете пропустить этот пункт, так ничего и не выбрав, а добавить закладки чуть позже.
Блокировщик рекламы
Воистину прекрасная фича на уровне браузера, а не на уровне костылей в виде AdBlock и иже с ними. Включаем галочку и все, рекламы нет, о ней можем забыть. Вот так всё просто.
Браузер по умолчанию
На последнем шаге браузер предлагает сделать себя браузером по умолчанию. Всё это вы так же можете сделать немного позже, если пока по каким-то причинам сомневаетесь.
В качестве «плюшки» браузер в конце выдает карточку пользователя. Она ни на что не влияет, исключительно элемент повышения лояльности, которым можно поделиться в социальных сетях.
Левое меню
Если посмотреть на браузеры Chrome, Firefox, Yandex, то они имеют привычное расположение вкладок — сверху.
Arc же предоставляет всю навигацию по страницам через левое меню: рабочие пространства, папки, файлы, мольберты, постоянные и временные страницы. Весь контент веб-страниц располагается справа.
Скрыть левое меню можно горячей клавишей CMD+S (как сохраняем документ).
Если не помогло одно нажатие, то сделайте два. Браузер понимает, когда вы находитесь на странице, которая поддерживает такую комбинацию клавиш и пропускает закрытие левого меню, отрабатывая как сохранение.
Режим фокусировки и скрытие левого меню в браузере Arc
Рабочие пространства (Spaces)
Рабочее пространство — это группы, в которых вы сможете разделить интернет-страницы на типы вашей деятельности. Например, пространство с поиском отеля в отпуск, пространство с учебной темой, пространство с корпоративными ресурсами.
Рабочее пространство можно кастомизировать: добавить иконку, сменить название и выбрать цвет темы оформления.
Удобно, что между пространствами можно переключаться с помощью обычного свайпа на тачпаде ноутбука или с помощью magic mouse.
Избранное
Открывается мгновенно, присутствует на всех рабочих пространствах. Добавить в него закладку можно вызовом контекстного меню ПКМ — Move to — Favorities.
Удалить закладку из избранного ПКМ — Archive Tab.
Закреплённые страницы
Вкладки, которые не закроются никогда, пока вы их сами не закроете. Их можно перетащить из секции «Today» просто мышкой или переместить через контекстное меню ПКМ — Move to — Pinned.
Обратно по той же схеме, но в секцию Today.
Страницы "Сегодня"
Вкладки, которые по прошествии времени (по умолчанию 12 часов) отправляются в архив. Это время можно изменить в настройках (Arc — Preferences — General — Archive tabs after). Их также можно закрыть по кнопке Clear.
Папки
В каждом рабочем пространстве помимо закрепленных и временных страниц можно создать папки, в которых вы будете хранить материал по нужным вам темам.
Папки не улетают в архив и ведут себя как закрепленные страницы.
Папки и страницы можно перемещать между рабочими пространствами через перетаскивание мышкой или контекстным меню (ПКМ — Move to).
Смена названия
Всем вкладкам и папкам можно менять название на ваше усмотрение, чтобы точно знать, какой контент она содержит.
Сменить название можно или двумя кликами мыши или ПКМ — Rename.
Архив
Привычная история браузера теперь называется «Архив». Посмотреть его можно в верхнем меню Archive — View archive. И отфильтровать по параметрам: закрыты автоматически / вручную, в каком рабочем пространстве (Spaces) искать.
Так как браузер работает на движке Chromium у него есть стандартные вещи, к которым мы привыкли в Google Chrome. История браузера так же присутствует в классическом ее виде: Archive — View History.
Скриншоты
Прямо не выходя из браузера можно сделать скриншот страницы: как выбранной вами области, так и конкретного блока. Достаточно навести курсор на URL, выбрать иконку фотоаппарата и выбрать нужный блок.
Снимок можно сделать отдельного блока на верстке, а можно просто растянуть рамку с зажатым курсором и сделать снимок произвольной области.
Я так и не выяснил, почему отдельные блоки он умеет фотографировать, а другие не умеет. Кажется, тут все зависит от уровня вложенности html-элементов. Если разгадаете эту загадку Жако Фреско, то напишите, пожалуйста, в комментариях ее решение.
Скриншот сайта в браузере Arc
После того как вы сделали скриншот, файл можно сохранить. Сохраняет браузер в папку Downloads.
Но магия здесь в том, что если вы откроете скриншот из самого браузера, то он подтянет метаданные с сохраненным адресом страницы, на которой был скриншот сделан. Вы без труда сможете вернуться к странице если потребуется.
Что еще можно сделать со скриншотом:
сохранить в библиотеку,
скопировать в буфер обмена (и например вставить в Figma),
сохранить в свою папку,
отправить в iMessage,
отредактировать,
переснять,
добавить на мольберт (easel), но об этом чуть ниже.
Командная строка
Мощная командная строка, которая позволит выполнять команды не прибегая к мышке. Вызов строки происходит по горячей клавише CMD + T.
В нее вы можете сразу написать поисковый запрос, который откроется в предпочтительной поисковой машине или вбить сразу нужный сайт.
Но функционал этой строки не ограничен этим. Здесь можно искать ранее закрытые вкладки или вбивать команды для создания мольбертов, заметок, рабочих пространств.
Весь список команд для работы в командной строке вы можете найти в документации: browserinc.notion.site/Command-Bar-T-Actions
Быстрое окно просмотра (Little Arc)
Помимо основного окна браузера у него есть свое модальное окно. Предпросмотрщик сайтов и виджетов браузера.
Первый сценарий
В самом браузере, когда мы открываем виджеты заметок, мольберта и скриншотов.
Помогает быстро просмотреть содержимое страницы. Если нас устроит, то можем одной кнопкой открыть в нужном нам рабочем пространстве в виде вкладки.
Второй сценарий
При установке браузером по умолчанию, открывает все внешние ссылки откуда бы вы их не открыли.
Друг прислал ссылку в телеграм, нажали, открылось модальное окно поверх всех окон. Посмотрели, понравилось — отправляем в браузер в виде вкладки. Не понравилось — закрыли и не засоряем себе рабочую область и прыжками из браузера в другие окна.
Третий сценарий
Это вызов окна Little Arc самостоятельно, чтобы посмотреть в нем сайт и не засорять рабочую область. Открыть его можно из меню File — New Little Arc Window или горячей клавишей CMD + Option + N.
Вызов модального окна Little Arc в браузере
Профили
Отделяют одни рабочие данные от других, записывают файлы куки только в свой профиль и позволяют авторизовываться под разными учетными данными в одном пространстве и браузере.
Пример
У вас две учетные записи в телеграм: одна рабочая учетная запись, вторая личная. Чтобы не открывать два разных браузера или режимы инкогнито, достаточно просто создать второй профиль в Arc.
Создание профиля
Создать новый профиль можно из любой рабочей области. Нужно навести на иконку с тремя точками напротив названия и выбрать Profile — New Profile.
Все настройки профиля: название, поисковая машина, пароли, уведомления и данные, которыми вы делитесь можно настроить в главных настройках: ARC — Preferences — General.
Split View
Вы можете открыть до 4-х интернет-страниц сразу в одном пространстве, чтобы сравнивать данные, контент или держать открытым месенджер на основной странице, где вы работаете.
Пока я пишу эту обзорную статью, то я периодически подглядываю в документацию, в которой сам Arc рассказывает о некоторых своих фичах. Мне не нужно щелкать с вкладки на вкладку, я могу управлять шириной каждого окна и если мне будет недостаточно места, то я скрою левое меню.
Достаточно оставаться на той странице, к которой вы хотите добавить Split View. Ищете вторую страницу и жмете ПКМ — Open in Split View.
А дальше двигаете окна как вам удобно. Напротив каждого окна сверху справа есть контекстное меню действий:
Separate Tab form Split — вытащить окно из режима Split View.
Archive Tab — отправить окно в архив.
Add right Split — добавить еще одно окно в Split View с правой стороны.
Мольберт (Easel)
Одна из прекрасных фич — мольберт. Это как Miro или FigJam, только проще. На мольберте можно рисовать стрелки, надписи, фигуры, вставлять изображения и рисовать.
Мольберт можно оставить приватным или расшарить друзьям на просмотр или редактирование.
Создать новый мольберт просто — в левом меню нажмите иконку «Плюс» — New Easel или воспользуйтесь горячей клавишей Control + Shift + E.
Чтобы понять, как работает доска, накидайте своих любимых мемов на нее: arc.net/e
Но самыми главными фишками для меня стали две вещи:
Скриншоты, с возможностью перехода по ссылкам
Живые ссылки-виджеты.
Скриншоты со ссылками
В качестве примера давайте посмотрим, как мы можем создать доску с дизайн-референсами прямо в браузере.
Нам нужно зайти на любимый сайт, пусть в нашем случае это будет Dprofile.
Сделать первый скриншот и в качестве действия — New Easel.
Подпишем мольберт и по той же самой схеме будем делать скриншоты, добавляя их в уже созданный и предлагаемый мольберт с названием «Референсы».
Все скриншоты имеют метаданные в виде ссылок. Когда мы помещаем скриншоты на мольберт, то мы без труда сможем открыть страницу, с которой мы сделали скриншот.
При командной работе, если этот мольберт пошарить коллегам, вы довольно быстро соберёте нужную базу для мудборда.
Использование такой фичи можно переложить на что угодно, например — выбор отеля при планировании отпуска.
Живые виджеты
Живые виджеты - это скриншоты, которые работают как iframe. Вы делаете всё то же самое: скриншот любой области сайта, помещаете его в уже созданный или новый мольберт. Там он хранится как изображение, но достаточно нажать на кнопку Play и виджет оживет, будет показывать актуальную информацию с адреса URL.
Как найти
Мольберты живут в левом меню, под иконкой «коробочки с фантиками». Можно нажать на нее или промотать влево все рабочие области.
Заметки
Визуальный редактор заметок, которые можно делать прямо в браузере и делиться ими на просмотр или редактирование с коллегами.
Создать новую заметку можно с помощью левой панели, внизу иконка «Плюс» — New Note или горячей клавишей Control + N.
В заметку можно добавлять:
Обычный параграф
Заголовки H1 — H3
Нумерованные и маркированные списки
Изображения
Ссылки
Заметки хранятся вместе с мольбертами на одной вкладке.
Бусты
Улучшения для страниц, если вы умеете в HTML, CSS и JS. Например, у какого-то определенного сайта вы хотите сделать темную тему. Разработчики сервиса не хотят делать, а вам на белый смотреть больно.
Вы не будете глобально вмешиваться в общий код, все применяемые стили работают исключительно в вашем браузере.
Фича больше для разработчиков, чем для рядовых пользователей:
Заменить CSS и посмотреть как работает сайт.
Временно заменить контент на сайте.
Добавить новые блоки и посмотреть, как они будут работать.
Мини-плеер
Штука максимально прикольная, ради этого я завел себе отдельно Yandex Browser. Открываешь вкладку с ютубом, щелкаешь кнопку и видео болтается в углу поверх всех окон. Удобно подглядывать одним глазом за роликом и работать.
Но такой флоу довольно утомителен, нужно скачать браузер, авторизоваться в ютубе, чтобы были твои рекомендации и каждый раз вспоминать где смотреть. Проходить этот путь открытия-закрытия утомляет.
Видео плеер
Arc предлагает без всяких дополнительных танцев просто открыть страницу с роликом, при переходе на другую страницу или рабочую область, мини-плеер с видео автоматически прыгает в угол монитора.
Даже если вы свернёте браузер, то окно с видео всё равно будет отображаться поверх окон. Видео не привязано к браузеру, а ко всей рабочей области ОС.
Аудио плеер
Такая же история работает, если мы запустили музыку в каком-то сервисе. Например в Яндекс.Музыке. Давайте послушаем КиШа, он как раз на волне популярности из-за сериала, а я его уже заслушал до дыр за полтора месяца 😄.
Заходим в Я.Музыку, включаем трек и так же начинаем перемещаться по вкладкам и рабочим областям.
Теперь можно успокоиться и забить на бешеный поиск вкладки из которой сейчас играет музыка, плеер теперь на виду, а по клику одной кнопки можно сразу перейти на ту страницу, откуда была запущена музыка.
Выключение плеера
На любом сайте вы можете быстро выключить настройку мини плеера, чтобы он вам не мешался. Достаточно на странице с медиа навести на поле с URL, выбрать значок замка и там снять галочку Mini Player.
Быстрое превью
Быстрое превью, это сайты, которые Arc превратил в мини-виджеты. Быстрое превью доступно когда ваши закладки добавлены в избранное. Сейчас поддерживаются сервисы:
Google Calendar
Gmail
Outlook
GitHub
Notion
Figma
Linear
Достаточно навести курсор на закладку и выбрать предлагаемый пункт.
Переключатель вкладок
Работает так же как переключение окон в MacOS, только горячие клавиши немного другие: Control + Tab.
Мобильное приложение
Сейчас уже доступно мобильное приложение в AppStore, но на мой взгляд оно еще максимально сырое. Синхронизация вкладок и рабочих областей происходит через iCloud. Профили не синхронизируются ни с одним устройством.
Данный браузер пока нельзя добавить в качестве браузера по умолчанию на iOS 💩
Инвайты
Браузер пока работает через прямую выдачу доступа через сайт или дружеские инвайты. Отправить заявку на доступ вы можете по ссылке arc.com. Или по приглашениям, которых всего десять.
5 приглашений в революционный браузер Arc: arc.net/gift
И еще 5 приглашений в революционный браузер Arc: arc.net/gift
После регистрации и установки? у каждого из вас будет доступно по 5 инвайтов. С первых десяти пользователей мы получим еще 50 инвайтов. Каждые 5 дней вам будут доступны еще по 5 новых приглашений.Найти ссылку-приглашение можно в меню Arc — Gift Arc to a Friend.
Предлагаю этим счастливчикам, установившим браузер, поделиться ссылками на приглашение в комментариях 😘