С Новым годом, Хабр! Благодарю всех, кто читал и поддержал прошлые статьи. Такой отклик очень мотивирует. Итак в прошлой статье я рассказал, как нашел свою мечту и заказал первую тестовую Матричную клавиатуру и Arduino pro micro. В этой покажу и расскажу, как я приступил к проектированию корпуса: какие референсы использовал и в каких программах работал.

Поиск вдохновения и референсов

Первый экземпляр который я изучал для работы это был Loupedeck Plus клавиатура для лайтрума. Я занимаюсь ретушью фото и 3д графикой в целом для меня это было актуально.

На тот момент клавиатура только вышла, и все обзоры на неё были положительными. К этому времени у меня уже была A4Tech X7 G100 и это крупный девайс. Фотографии в карточках товаров на оzon не передают его реальные габариты, на столе он занимает много места рядом с основной клавиатурой. Именно поэтому форм-фактор Loupedeck сразу показался спорным. Большое количество крутилок, много пустого пространства и ориентация на одну программу и в целом одну задачу. Loupedeck работает только с Lightroom использовать его для монтажа, работы в 3D-софте или в Figma уже не получится.

Следующим был 3Dconnexion. Устройство с первого взгляда выглядит так, будто его позаимствовали с пульта космического корабля ? Отзывов было много и почти все положительные. Хвалили джойстик-крутилку за то, как сильно она упрощает работу в 3D, и клавиши за удобное расположение прямо под пальцами. Форм-фактор у устройства действительно удачный, всё лежит под рукой. Это, безусловно, шик и блеск. Но есть одно ограничение. Цена.

При этом 3Dconnexion снова ориентирован в первую очередь на 3D-софт и CAD-программы. Работа, например, в Figma или Illustrator уже не подразумевается.
Кстати, сейчас на Авито часто и много продают их почти новыми. Я всё больше убеждаюсь, что переучить себя с классической раскладки ctrl, shift, alt на какой то другой формат довольно сложно, даже если она кажется очень удобным.

Та cамая!

И потом я встретил её! Из всех устройств именно она оказалась той самой и даже как будто подмигнула мне ? Речь про Blackmagic DaVinci Resolve Speed Editor. Наткнулся на неё случайно. Я как раз планировал переход с Adobe Premiere Pro на DaVinci Resolve и, изучая сайт, увидел клавиатуру с макросами. Буду честен, в тот момент у меня было простое желание слизать дизайн целиком. Кажется, это называется реверс-инжиниринг. Кстати я тогда наткнулся на автора в ютюбу который как раз собирал подобную макрос клавиатуру и подробно рассказывал этапы проектирования. https://youtu.be/3yVYp-gT71M

Пойдем по основным характеристикам которые я отметил для себя:

• Слева расположены стандартные клавиши классической раскладки: ctrl, shift, alt, command. Нет нужды переучиваться, инструмент сразу облегчает работу.

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

• Разные механические клавиши: одни предназначены для частых нажатий, другие с физическим щелчком.

• Я заметил удобное разделение между секциями. При работе не хочется постоянно смотреть на клавиатуру, и такое разделение помогает ориентироваться.

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

Определение требований к прототипу

Итак, основная философия макрос-клавиатура строения которую я для себя создал!

• Небольшой размер чтобы спокойно ставить устройство рядом с основной клавиатурой. Сейчас, в эпоху ИИ, когда большая часть работы связана с написанием промтов, положение клавиатуры на столе стало ещё более важным.

• Нет пустому пространства, как у Loupedeck, где примерно 40% площади остаются неиспользованными.

• Слева расположена стандартная классической раскладки: ctrl, shift, alt, command. Нет нужды переучиваться, инструмент должен облегчает работу.

Начало работы над прототипом

Клавиши это ключевой момент. Сколько их нужно для идеального макропада? На DaVinci Resolve Speed Editor 43 клавиши, что слишком много. Кроме того, механические колпачки у них широкие, и устройство получается большим. В первой версии я сократил количество примерно вдвое. 21 клавиши оказалось в целом достаточно.

Чтобы сразу было удобно работать и не переучиваться, слева я разместил классическую раскладку клавиш ctrl, shift, alt, z. Рука сразу ложится в привычную среду обитания. Выше две клавиши размером 1,75u сенсорно отделил их, чтобы понимать ctrl+c или ctrl+v, ведь копировать и вставить, этот набор часто составляют основную рутинную работу.

Позже вышла Loupedeck CT. Она тоже попала в список моих идеальных референсов. Мне понравилась крутилка в центре.

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

Поэтому было принято волевое решение сместить крутилку из правой части в центр.

Итак в центре оказались большая клавиша пробела и крутилка. Справа я разместил элементы завершения действий, так я их для себя называю. По аналогии с левой стороной, где используется классическая раскладка ctrl, shift, alt, правая часть повторяет логику numpad с клавишами Enter и Delete. Там идут макросы из серии ctrl+w для закрытия проекта и ctrl+shift+s для сохранения как. Эти клавиши почти не используются в процессе работы, но всегда нужны в самом конце.

Рисование скетчей и примерную схему я рисовал в miro.com. Там удобно собирать референсы и делать быстрые черновые зарисовки. Есть ещё Figma, но она уже ощущается более серьёзным инструментом, в котором хочется всё доводить до идеала и тратить на скетчи больше времени, чем нужно. По крайней мере у меня так ?

Чертёж корпуса я собирал в Adobe Illustrator. Особенно удобно пользоваться новой линейкой с указанием расстояний. Конечно, в AutoCAD было бы правильнее чертить полноценный чертёж, и позже с этим придётся столкнуться довольно болезненно, но пока пользуюсь тем, что умею.

Тут я сместил Arduino из правого угла ближе к центру. Это решило проблему с проводом. Теперь он выходил из средней части макропада, а это лишние несколько сантиметров провода. Колесо при этом немного приподнялось и стало меньше, так как под ним осталась большая клавиша пробела.

Раскладку клавиш я делал в keyboard-layout-editor.com. Сервис сразу учитывает размеры и расстояния между клавишами, так что две клавиши 1u по габаритам получаются как одна 2u.

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

В какой то момент я придумал простой лайфхак. Чтобы точно пристрелять размер клавиатуры и расположение клавиш, я отдавал чертёж из Illustrator на резку оргстекла. Использовал прозрачный оракал толщиной 1,5 мм. 3D принтера тогда у меня ещё не было, а такой способ оказался очень бюджетным и быстрым. Я сразу заказывал плату и верхнюю крышку, чтобы на месте проверить размеры и удобство.

Сам корпус я проектировал в Cinema 4D. Из Illustrator можно экспортировать вектор в масштабе и визуально смоделировать клавиатуру. Там же, на рендере со светом и примерной обстановкой, я подбирал цвета, скругления и общий дизайн корпуса. Опыта и насмотренности пока немного, поэтому результат чаще всего напоминал домашний телефон с дисковым набором ?

Пока я рисовал корпус и искал удачные скругления, параллельно начал проектировать плату. По заветам AlexGyver трассировку делал в easyeda.com. В качестве основы брал готовые проекты из библиотеки с Arduino и клавишами, переделывал их под себя и использовал как учебный материал. В целом ничего сложного там не было. Нужно было просто развести дорожки по ножкам с учётом матричной структуры и вывести их на пины Arduino. За основу я взял код из урока про матричную клавиатуру. В оригинале это была схема 4x4 на 12 клавиш, а у меня получилось 21 клавиша. В итоге я сделал матрицу 5x5 на 25 клавиш, оставив четыре пересечения пустыми. Платы в те годы можно было заказывал там же, в EasyEDA. Это конечно было удобно…

Так появился мой первый прототип под кодовым названием «Божественная клавиатура»

На борту стояла Arduino Pro Micro. Первое время кейкапов не было, нажимать на клавиши было неудобно, но даже в таком виде макропад заметно ускорял работу. Всего пришло пять плат, из них я собрал три клавиатуры для друга коллеги, жены и для себя. Изначально крутилки не было. Тогда мне не хватило опыта развести под неё дорожки, поэтому я решил отложить этот момент. План был простой. Припаять её потом отдельно и приклеить модуль с энкодером на горячий клей.

Первый рабочий код был готов ещё на этапе тестов с мембранной клавиатурой. Макросы легко менялись прямо в Arduino IDE, и на этом этапе всё работало. Друг без проблем разбирался в коде и мог сам менять макросы под себя, а вот для жены мне регулярно приходилось переписывать их вручную.

#include "Keyboard.h"
// Library with a lot of the HID definitions and methods
// Can be useful to take a look at it see whats available
// https://github.com/arduino-libraries/Keyboard/blob/master/src/Keyboard.h

// ----------------------------
// Additional Libraries - each one of these will need to be installed.
// ----------------------------

#include <Keypad.h>
// This library is for interfacing with the 4x4 Matrix
// 
// Can be installed from the library manager, search for "keypad"
// and install the one by Mark Stanley and Alexander Brevig
// https://playground.arduino.cc/Code/Keypad/

const byte ROWS = 5; 
const byte COLS = 5; 

// the library will return the character inside this array
// when the appropriate button is pressed.
char keys[ROWS][COLS] = {
  {'A', 'B', 'C', 'D', 'E'},
  {'F', 'G', 'H', 'I', 'J'},
  {'K', 'L', 'M', 'N', 'O'},
  {'P', 'Q', 'R', 'S', 'T'},
  {'U', 'V', 'W', 'X', 'Z'},
};

byte rowPins[ROWS] = {2, 3, 4, 5, 6}; //red jepa
byte colPins[COLS] = {7, 8, 9, 10, 16}; //blue luna

Keypad keypad = Keypad( makeKeymap(keys), rowPins, colPins, ROWS, COLS );

void setup() {
  Serial.begin(9600);
  Keyboard.begin();
}

void sendMacroCommand(uint8_t key) {
  Keyboard.press(KEY_LEFT_CTRL);
  Keyboard.press(KEY_LEFT_SHIFT);
  Keyboard.press(KEY_LEFT_ALT);
  Keyboard.press(key);
}

void loop() {
  char key = keypad.getKey();

  if (key) {
    Serial.println(key);
    switch (key) {
      case 'A':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press('w');
        break;
      case 'B':
        Keyboard.press(KEY_DELETE);
        break;
      case 'C':
        Keyboard.press(KEY_RETURN);
        break;
      case 'D':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press(KEY_LEFT_SHIFT);
        Keyboard.press('s');
        break;
      case 'E':
        Keyboard.press(KEY_TAB);
        break;
      case 'F':
        Keyboard.press('b');
        break;
      case 'G':
        Keyboard.press(' ');
        break;
      case 'H':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press(KEY_LEFT_ALT);
        Keyboard.press('g');
        break;
      case 'I':
        Keyboard.press('e');
        break;
      case 'J':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press(KEY_LEFT_SHIFT);
        Keyboard.press('n');
        Keyboard.press(KEY_RETURN);
        break;
      case 'K':
        Keyboard.press(' ');
        break;
      case 'L':
        Keyboard.press(' ');
        break;
      case 'M':
        Keyboard.press(' ');
        break;
      case 'N':
        Keyboard.press(' ');
        break;
      case 'O':
        Keyboard.press(' ');
        break;
      case 'P':
        Keyboard.press('s');
        break;
      case 'Q':
        Keyboard.press(' ');
        break;
      case 'R':
        Keyboard.press('x');
        break;
      case 'S':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press('z');
        break;
      case 'T':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press('j');
        break;
      case 'U':
        Keyboard.press(KEY_LEFT_SHIFT);
        Keyboard.press('j');
        break;
      case 'V':
        Keyboard.press(' ');
        break;
      case 'W':
        Keyboard.press(KEY_LEFT_CTRL);
        break;
      case 'X':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press('g');
        break;
      case 'Z':
        Keyboard.press(KEY_LEFT_CTRL);
        Keyboard.press('t');
        break;
     
    }

    delay(100);
    Keyboard.releaseAll(); // this releases the buttons
  }
}

Параллельно обнаружилась ещё одна проблема. Если неправильно скомпилировать прошивку или выдернуть клавиатуру из провода чуть раньше окончания компиляции, припаянная Arduino превращалась в тыкву. В таком случае её приходилось выпаивать и ставить новую. Так-же широкая часть провода у основания, которая втыкается в arduino была слишком близко, и со временем отламывала usb вход, что снова убивало arduino.

Я кстати сам пробовал сделать самодельную плату))

Позже я окончательно доработал корпус и заказал печать на 3D принтере. Вышло, конечно, недёшево. За верхнюю и нижнюю часть мне выставили цену около 1200 рублей.

На распечатанном корпусе вылезли основные проблемы

• не просто найти клавиши 1.23u

• Провод внутри корпуса выглядел не очень камильфо и к тому же был направлен не в ту сторону.

• На AliExpress не оказалось готовых решений с большими крутилками, а 3D печать оставалась дорогим вариантом. Стандартные же решения сводились к маленьким пластиковым крутилкам, которые совсем не подходили под задумку.

• Ну и в дополнение ко всему стало понятно, что нужно делать собственное приложение для программирования клавиш, без необходимости лезть в код Arduino.

• Так-же корпус делал клавиши ещё выше, из за чего рука оказывалась в согнутом положении и кисть быстро уставала.

На этом этапе проектирование корпуса и первая версия макропада были завершены. Макропад работал, было понятно, что впереди ещё много итераций, ошибок и улучшений.

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

Спасибо за внимание! Буду рад вашим вопросам и комментариям. Если что-то осталось непонятным или хотите узнать подробнее про какой-то этап — с радостью отвечу в комментариях ?