▲

애플 Lisa의 UI를 기반으로 한 1비트 그래픽 웹 OS

 (alpha.lisagui.com)
1P by GN⁺ 5시간전 | ★ favorite | 댓글 1개
  • 개인 개발자가 Apple Lisa의 사용자 인터페이스를 재현한 웹 기반 운영체제를 제작함
  • 이 프로젝트는 1비트 흑백 그래픽을 특징으로 하며, 레트로 컴퓨팅 매니아들에게 흥미로움
  • 데스크톱, 아이콘, 파일 창 등 1980년대 Apple Lisa의 디자인을 충실히 모방함
  • 웹 브라우저 상에서 바로 실행 가능하며, 별다른 설치 과정이 필요하지 않음
  • 오픈소스로 공개되어 다른 개발자들의 커스터마이징과 확장이 용이함

프로젝트 소개

  • 이 프로젝트는 Apple Lisa의 초기 데스크톱 운영체제 UI를 웹 환경에서 직접 경험할 수 있도록 한 웹 OS 개발임
  • 1비트(pure black & white) 그래픽을 사용해 레트로한 사용자 경험을 제공함
  • 데스크톱, 아이콘, 창, 앱 실행 등 전통적인 데스크톱 환경을 재구성함
  • 실제 운영체제 기능 전체를 구현하지는 않았지만, UI 동작과 시각적 요소 재현에 집중함
  • 현대 브라우저만 있으면 바로 접근할 수 있어 기술적 진입장벽이 매우 낮음

주요 특징

  • 1983년에 출시된 Apple Lisa UI 디자인을 충실하게 모방함
  • 드래그 앤 드롭, 창 이동 및 크기 조정 등 핵심 UI 반응을 실감나게 재현함
  • 단순하지만 정교한 1비트 그래픽 스타일로 독특한 시각적 감성 제공
  • 앱 목록 및 파일 브라우징, 간단한 앱 실행 등 데스크톱 운영체제의 기본 요소 포함함

활용 및 의미

  • 레트로 컴퓨팅이나 UI/UX 디자인 연구를 위한 훌륭한 데모 자료임
  • 초보 개발자도 소스코드를 분석하며 웹 UI 체계 및 레이아웃 구조 이해 가능함
  • 오픈소스로 배포되어 커뮤니티가 다양한 방식으로 기능 추가나 테마 수정을 시도할 수 있음

기타 참고 사항

  • 별도의 복잡한 설치 과정 없이, 링크를 통해 바로 웹에서 구동 가능함
  • 소스코드는 Github 등 공개 저장소를 통해 제공함
  • 본 프로젝트는 영리 목적이 아닌, 실험적 시도와 교육적 목적에 중점을 둠
▲
GN⁺ 5시간전  [-]
Hacker News 의견

  • Lisa는 정사각형 픽셀이 아니라서 캔버스 비율을 가로 대비 세로 1.5배로 설정함, 고해상도 디스플레이에서는 픽셀 자체가 2픽셀 너비 × 3픽셀 높이이기 때문에 꽤 괜찮게 보이지만, 저해상도 디스플레이에서는 픽셀이 1픽셀 너비 × 1.5픽셀 높이로 표현되어 왜곡 현상 발생, 이건 설계상 감수한 부분임, 하지만 충분히 큰 저해상도 디스플레이에서 창 크기를 넓게 조절하면 자동 정수 배율 기능이 작동해서 픽셀 자체가 더 크게 나오게 됨, 환경설정 앱의 디스플레이 옵션에서 강제로 설정 가능, 만약 배율 설정을 꼬았다면 LisaGUI를 재시작하면서 shift키 누르고 있으면 초기화 가능, 그리고 iOS에서 PWA 관련 캔버스 위치 버그가 소소하게 있어서, 단말기 회전 후 원위치하면 해결 가능하지만 꽤 번거로운 점도 있음, 창을 닫을 때는 타이틀바에 있는 아이콘을 더블 클릭하면 창이 아이콘 형태로 접힘

    • 동적으로 창이나 폰트 크기 조정(브라우저 크기에 상관없이)을 어떻게 처리하는지 궁금, 기본적으로 html에서는 이런 게 자동이지만 이 프로젝트에서는 어떤 방식인지 궁금

  • Apple ][/e나 /c 클론(불가리아산 Pravetz 8Ц)이 내 첫 컴퓨터였고 그 다음엔 Hercules 모노크로 모니터가 달린 286, 386 PC도 사용했었기 때문에, 이번 프로젝트에서 멋진 레트로 UI를 보면서 Think-Pascal 시절이 떠오르는 감성

  • 이런 독특한 Lisa GUI 프로젝트가 바로 내가 Hacker News를 좋아하는 이유, 순수 바닐라 JS와 시대를 앞섰던 UI에서 배우는 경험이 쏠쏠, 데모/예제에 브레이크아웃 스타일 게임처럼 바로 즐길 수 있는 게임이 추가되면 더 좋겠다는 마음

    • 고마운 마음 크다는 얘기 전하고 싶고, 다음 게임은 솔리테어 만들 예정, 그리고 Xerox Alto의 Mazewar 같은 게임도 언젠가 만들고 싶다는 생각, 특히 네트워킹 구현이 쉽진 않지만 Xerox에 대한 오마주로 시도해 볼 예정

  • Preferences 앱에 있는 그림자 텍스트 스타일과 fatbits 에디터를 보고 40년 전 UX를 걷어내도 여전히 생산적이고 직관적이라는 사실이 매우 인상적, 다만 창 닫기 버튼이 없는 점이 아쉬움, 한 번 클릭만으로 메뉴가 열려 있는 기능은 이런 UX 발전에서 꽤 후대에 들어온 좋은 변화임

    • sticky(고정) 메뉴는 시간이 훨씬 지난 뒤 도입된 기능임, 이번 구현에서는 현대 사용자들이 익숙해서 일부러 포함함, 클릭 한 번으로 메뉴를 열어놓거나 마우스를 누른 상태에서 끌어서 열고 마우스 버튼을 떼면 닫히는 식, 과거 Mac OS(System 6)에서도 sticky 메뉴를 쓸 수 있게 해주는 익스텐션이 있는데, 여기서는 그 기능을 좀 더 옛날까지 소급해서 넣어봤다는 설명, 그리고 창을 닫으려면 타이틀바 아이콘 더블클릭하면 됨도 추가

    • 창 왼쪽 상단 아이콘 더블클릭하면 창이 닫히는 동작 존재, File > Set Aside의 단축키 같은 개념

  • Lisa를 오래 써본 경험은 없지만 90년대 초 기술자로서 여러 대의 Lisa를 써보고 Mac XL로 개조했던 추억, 이번 프로젝트는 UI 재현도가 매우 높아 클릭해보는 재미와 함께 좋은 경험 제공

  • 예전엔 Lisa 에뮬레이터도 사용해본 적 없었는데, 이번 덕분에 처음으로 써보게 된 소중한 경험, 오랜만에 GUI의 근본적인 생각을 다시 돌아볼 수 있게 해줘서 고마운 감상

  • GUI라는 단어를 소리 하나하나 따로 따로 발음하는데, 굳이 "구이(gooey)"처럼 묶어서 읽을 필요가 없다는 생각, 농담 반 진담 반으로 동지애

    • 약어와 이니셜리즘은 모두 소리 내어 읽자는 주의, TUI는 '투이', CLI는 '클리', TCP/IP는 '티키피피', GPT는 '기피티', DNS는 '던스', HTTP는 '히텁', USB는 '우즈버', USB-C는 '우즈버크' 같은 식으로 유쾌하게 제안

    • 이런 사소한 발음 논쟁이 요즘 정치 같은 심각한 얘기보다 훨씬 재밌고 즐거운 논쟁거리, 예: vi vs emacs, vi vs vim, IF(이프) 발음, m68k vs x86, Mac vs Amiga, BSD vs Linux 등등

    • 같은 생각을 가진 사람이 있다는 점 반가운 연대감

  • 모바일에서 마우스 커서를 사용할 때는 Microsoft Remote Desktop의 방식이 편리한데, 손가락이 아니라 화면 아무 곳이나 움직이며 커서를 별도로 이동시키는 방식, 직접 사용해보면 느낌이 옴, 이에 대한 개선 제안

    • 이미 구현해두었다는 답변, 환경설정의 터치스크린 옵션 패널에서 트랙패드 모드를 켜면 동일한 방식의 터치 커서 경험 가능

  • 모바일에서 시도해봤는데 반응성이 인상적으로 뛰어남

    • 사용해봤다는 피드백에 고마운 마음

  • 작은 화면의 iPhone SE에서는 제대로 동작하지 않아서, 다음번엔 하드웨어 업그레이드로 더 나은 OS 경험을 해보고 싶다는 생각

답변달기