하이벡터 – 빠르고 현대적인 SVG 편집기

Hacker News 의견

• 나는 C++ SVG 렌더링 라이브러리를 사이드 프로젝트로 개발 중이며, 좋은 SVG 에디터를 찾아본 적이 없었음, 그래서 주로 Illustrator를 쓰고 결과 마크업을 정리하거나, 텍스트 기반 편집기인 svgviewer.dev을 사용함, 너의 UX가 매우 세련되어 있고 기존에 찾은 다른 툴들보다 더 다양한 기능을 이미 지원하는 점이 인상적임, 내 프로젝트 donner도 웹 기반 코드 편집기 프로토타입을 제공함, SVG의 잠재력이 크나 도구의 한계에 발목 잡히고 있었던 분야라 혁신이 일어나서 기쁜 마음임
  • inkscape에 어떤 문제가 있는지 궁금함, 약간의 버그가 있긴 하지만 대체로 잘 동작하는 느낌임
• 시작이 좋아 보임, 몇 가지 명확하게 빠진 기능이 있음: 노드 툴을 편집할 때 시작/끝 노드가 서로 붙도록 쉽게 스냅이 되었으면 좋겠고, 특히 연필툴로 그릴 땐 스냅 거리가 더 넓으면 좋겠음, Wick Editor 스타일의 변형 및 왜곡 툴이 모바일 친화적일 거라 생각함, 다각형에서 코너 라운딩이 안 되면 그 기능은 숨기거나 비활성화되는 게 낫겠음
  • 이런 피드백을 정말 원하고 있었음, 고마움
• 하이레벨 제어가 가능해서 정말 좋았음, 예컨대 경로 반전처럼 실제로 눈에 안 띄는 변경에도 제어가 들어가는 점이 마음에 들었음, 하지만 반전 실행 여부를 알아보기 힘드니 피드백이 있으면 좋겠음, 선택 복사를 하면 사용된 모든 폰트가 base64로 SVG에 포함되어 파일이 비대해지는 현상이 있음, SVG와 1:1 매핑을 계속 고수할 생각인지 아니면 추상화도 고려하는지 궁금함, 나는 Figma에서 Vector Networks라는 기능 때문에 계속 그쪽을 쓰고 있음, 비록 유효 경로 데이터로 내부 변환이 필요하겠지만 매우 유용할 것임, 기술적으로 SVG 렌더링 방식을 채택했다는 점이 놀라웠고, canvas 기반일 줄 알았음, 최근에 SVG로 3D 오브젝트를 렌더링해봤다가 성능 이슈를 금방 만났는데, 원인은 아직 발견 못했음, 혹시 구형 기기에서 스트레스 테스트 한 경험이 있는지 궁금함
  • Vector Networks(나는 path graph라 부름)는 실제로 불린 패스 작업을 할 때 이미 보유했던 중간 구조였음을 한동안 몰랐음, 최근까지는 Vector Networks를 회의적으로 봤지만, 요즘 AI 생성 이미지가 많아지면서 비트맵 벡터화 결과로서 멋질 것 같다는 생각을 하게 됨, 도입하고 싶은 기능이지만 우선순위에 더 시급한 일들이 산더미처럼 많음, 스트레스 테스트도 계속 할 예정이고 엄청나게 느린 100유로짜리 옛날 안드로이드 태블릿으로도 돌려봄, Hacker News에 글 작성은 즉흥적으로 올렸고 테스트를 좀 더 했어야 했음, 예전엔 오래된 ThinkPad 머신으로 바로바로 성능 문제를 느끼려고 했는데, IDE가 점점 무거워져서 불가능해짐, 그래도 옛날 기기를 계속 남겨두고 잘 돌아가는지 확인하려고 함, 댓글에서 나온 제안들은 모두 보고 issue로 만들 예정임, 너무 많은 유익한 피드백이 쏟아져서 놀라움, 5 업보트랑 2개 정도 댓글만 기대했었음, SVG 렌더링 방식을 쓴 이유는 저장된 SVG 파일과 렌더링이 완전히 똑같이 보이게 하고 싶었기 때문임, Overlay는 Canvas나 WebGL로도 고민해봤으나 지금은 대부분 이미지에서 충분히 빠르게 동작하고 있음
• KDE의 Karbon이 이렇게 직관적이고 빠른 SVG 편집툴이 됐으면 좋았을 거라는 생각임, 특히 SVG Path Editor가 제공하는 기능(예: 경로 좌표를 상대값으로 변환, path 내의 곡선·직선을 각각 편집 등)이 정말 필요함, 근데 아직 다른 어떤 에디터에서도 찾지 못함, 또 방대한 작업이긴 하나 애니메이션 기능이 추가된다면 아주 좋을 것임
  • SVG Path Editor라는 명칭의 프로젝트가 많은데, 여기서 소개한 yqnn.github.io의 프로젝트가 지금까지 써본 것 중 가장 진보적이고 사용할 만한 툴임
• 이 프로젝트가 꼭 성공했으면 좋겠음, 첫 사용자경험 관련 제안이 있는데, 시작하자마자 이미 만들어진 '비어있는 미지정 문서' 하나를 제공해 바로 연습할 수 있게 하고, 예를 들면 Bezier pencil 같은 재밌는 도구가 자동 선택되어 있으면 좋겠음, 나는 여러 번 클릭해서 문서가 없다는 걸 깨닫고 새 문서를 만든 뒤 툴을 바꿔서 써봤지만 대부분의 사용자는 여기에 금방 걸릴 것임, 또 캔버스의 기본 크기가 좀만 더 컸으면(예: 512 또는 500 정방형) 좋겠음, 새 것을 써볼 때 보통 10-20초 안에 재미가 없으면 바로 떠나는 게 현실임, 그 안에 바로 끌어들여야 함, 아주 잘 만들어져 있음
  • 동의함, 나는 바로 펜슬을 클릭해 낙서를 해보려 했는데 아무 일도 안 일어나서 실망스러웠음, 새 문서를 만든 후에도 역시 펜슬이 동작하지 않았음, 끝내 사용방법을 알아내지 못했음, Bezier 툴로 노드는 추가할 수 있었지만 다른 도구로 조작하는 데는 실패했음, Chrome/Windows에서 드래그 기능이 완전히 작동하지 않는 것 같음
• 어떻게 써야 할지 감을 잡지 못했음, 선분을 하나 만들어보긴 했는데 이동이나 크기 조절을 하는 방법을 못 찾았고, 드래그 핸들은 띄울 수 있었음, 사각형이나 원 같은 다른 모양도 전혀 만들 방법을 못 찾겠음, 버튼을 거의 20번씩 눌러봤지만 아무 동작도 안 됨
  • 메인 툴바에서 텍스트 툴과 이미지 툴 사이에 있는 것이 바로 shape tool임, 처음 두 개의 옵션이 사각형과 원임
  • 이런 앱은 사용 방법에 대한 힌트가 아주 풍부하게 나오도록 하고, 이걸 꺼둘 수 있도록 하는 게 좋다고 생각함
• 이 툴을 테스트해보면서 매우 빠르고 직관적이라 정말 즐거웠음, 특히 줌/팬 성능이 과거 툴들보다 월등히 좋았음, 한 가지 궁금한 점은 생성형 워크플로에 맞춘 플러그인 혹은 API 레이어를 추가하는 것에 대한 계획이 있는지임, SVG 편집에 스크립팅이나 AI 기반 시각효과를 섞어 쓰는 사용자가 점점 늘어나고 있어서, Hyvector에 미니 언어나 JS 브릿지 같은 프로그래밍 가능한 계층이 생기면 훨씬 더 강력해질 것임, 출시를 축하하며, 창의적 벡터 작업의 허들을 낮춰주는 새로운 툴이 늘어나는 것은 언제나 즐거운 일임
  • 고마움, 최근 본업 다른 프로젝트에서 AI를 조금씩 써보기 시작했고, AI 생성 통합 허용이 중요하다는 것에 동의함, AI와 벡터 에디터를 어떻게 조합하고 싶은지 더 자세히 이야기해줄 수 있으면 좋겠음, 나는 AI로 생성된 비트맵을 벡터화·컬러화하는 용도를 생각해봤지만 그 외에는 아직 고민한 적 없음
• 이 UX가 정말 마음에 듦, Wacom 기능이 되는 안드로이드 태블릿에서 아주 사용성이 좋았음, 스플라인 편집 방식(즉, 개별 핸들이 아니라 선상의 임의 지점을 드래그로 조절하는 것)이 어디서 온 아이디어인지 모르겠으나 확실히 좋았음, 한 가지 아쉬운 점은 왼쪽 트리에서 터치 스크롤이 안된다는 것임, 그 외에는 매우 부드러움, 혹시 단축키는 구현되어 있는지 궁금함
  • 곡선 드래그 구현법은 의외로 간단했음, 오래전 구글 포럼 토론에서 구현 아이디어를 얻었음, Shift를 누르고 드래그하면 핸들 방향도 유지됨, 왼쪽 트리는 모든 기기에서 완벽하게 처리하기 어려움, 클릭·터치 클릭·드래그앤드롭·스와이프 스크롤·터치 스크롤 등 모두 지원하며 수백 개 요소도 잘 보여줘야 하니까 복잡함, 아직 iOS에서 스와이프 스크롤이나 약간의 버벅임 등이 있는데 리스트에 등록해두었음, 키보드 단축키는 모바일 제외, 데스크톱에서 메뉴바를 열면 항목 오른쪽에 표시됨
• 직접 써보니 첫 시작이 매우 좋다고 느낌, UX가 특히 만족스러운데: 펜툴이 직관적이고 오브젝트 패널에서 각 레이어 미리보기가 나오는 점, 클리핑 패스 잘 통합, 텍스트-외곽선 변환 및 불린 작업 등 보기 드문 기능 제공이 마음에 듦, 비판적 피드백으론: 툴 간 전환 단축키가 있었으면 좋겠고 툴팁에 함께 표기되어야 함, Ctrl +/-로 줌 인아웃, 스페이스+드래그로 팬 지원이 되고 싶음, 그룹 편집 때 해당 그룹 안 개별 오브젝트를 선택하기 어렵고, 더블클릭은 노드 툴로 바로 전환되는데 그룹 고립 모드가 있었으면 싶음, 펜툴 사용 도중엔 이전 포인트의 컨트롤 포인트 조절이 가능해야 하고, 펜 모드에서 실행 취소가 경로 포인트 추가가 아닌 그 이전 작업만 되어서 불편함, 텍스트 지원이 제한적이며 @font-face 같은 내장 폰트가 표시되지 않고, 필터 지원도 마찬가지임, SVG 렌더링이 독립적으로 이뤄져서 브라우저에서 제대로 못 그리는 것 같음
  • 좋은 피드백에 감사함, 앞으로 며칠 동안 작성할 이슈가 정말 많아질 것 같음, 사실 Hacker News에 글 올릴 때 5 업보트와 2개 댓글만 바랬는데 반응이 엄청남, 그룹 내부 개별 오브젝트 선택은 Ctrl + 클릭으로 가능함, 아직 선택 로직이 깔끔하지 않아 더 개선할 예정이지만 당장은 이 방법이 도움이 될 것임
• 많은 가능성이 보여서 좋았음, 빠른 피드백으로 툴바가 캔버스 상단에 뜨는 구조는 집중이 깨지고 작업 공간이 줄어드는 면이 있음, 일반적인 툴바 배치나 캔버스 하단이 더 좋겠음, 아니면 툴바를 이동·접기 가능하게 해줬으면 함
  • 고마움, 툴바 디자인과 위치는 이미 여러 번 바꿨음, 창이 좁아지면 자동으로 접히는 기능이 이미 있는데, 접는 버튼 추가는 아주 쉽게 구현할 수 있음