[Tip] 피그마(Figma) 검은 화면 오류 해결

2016년에 샀던 노트북으로 쭉 개발해오다가 지난 여름 부스트캠프를 하면서 도저히 더이상은 안되겠다 싶어 데스크탑을 구매했다.

 

근데 웬걸, 피그마(Figma)가 노트북으로 했을 때보다 더 많이 렉이 걸렸고, 접속조차 되지 않았다.

데스크탑 앱을 설치해도 마찬가지였고, 접속을 하더라도 이런 회색 화면이거나 검은 화면이었다.

새로 고침을 여러번하면 어쩌다가 접속이 되는데, 여간 불편한 것이 아니었다.

 

 

피그마(Figma)란?
프로토타입을 만들 수 있는 실시간 디자인 협업 도구
데스크탑 앱도 있지만, Slack처럼 설치 없이 웹에서도 동작하는 것이 특징

 

로스트아크 환경설정

잠시 자랑겸 스펙을 짚고 넘어가자면 본인의 데스크탑의 경우 인텔의 i7-11700 CPU와 32GB의 RAM, RTX 3070 GPU를 사용하고 있어 적당한 게임들은 모두 풀옵으로 돌릴 수 있는 성능을 지니고 있다. 로스트아크도 풀옵으로 하고 있다.

 

아무튼 아무리 생각해도 충분한 사양임에도 피그마가 돌아가지 않는 게 이상해 피그마에서 PC의 자원을 충분히 활용하지 못하는 것 같고 추측했다.

 

또한 접속이 아닌 프로젝트를 여는 것 자체에 실패했을 때 다음과 같이 내 브라우저가 WebGL을 지원하지 않는다는 식의 문구가 떴었다.

Uh oh… we can’t open that file
We can’t open this file because WebGL isn’t supported, or is disabled, in your browser.

 

그래서 첫번째로 생각한 것은 내 브라우저가 문제인 것 같으니 데스크탑 앱을 설치하면 될 것 같았다. 그러나 처음에도 살짝 언급했듯이 별다른 개선 없이 똑같이 오류가 났다.

 

chrome://flags

그 다음은 chrome://flags로 들어가서 WebGL 관련 옵션을 켜주었다. 위 사진에 나와있다시피 본인은 현재 chrome 96.x 버전을 사용중이며, 여기 있는 옵션들과 UI는 버전마다 다를 수 있다고 한다.

 

Figma와 Chrome에 RAM 용량 분배도 높여봤고, WebGL 옵션도 켜줘봤지만 여전히 용량이 큰 프로젝트들은 오류가 났다. 접속에 성공하더라도 확대 / 축소를 반복하다보면 오류가 났다. 그런데 같이 프로젝트하던 팀원들은 딱히 문제가 없다고 했는데, 이제와서 생각해보니 웃긴 게 다들 맥북을 쓰고 있었다. 나도 꼭 장만할테다..

 

아무튼 그러다가 한동안 프로젝트를 쉬면서 피그마를 볼 일이 없었는데 최근에 다시 피그마를 볼 일이 생겼고, 여전히 처음에 가벼울 때에는 괜찮다가 이것저것 추가하기 시작하는 순간 오류와 다시 마주했다. 그래서 다시 싸워보기로(?) 했다.

 

피그마 공식 홈페이지(Figma Support Forum)에 생각보다 나랑 같은 증상을 겪는 사람이 많았다. 그런데 누구도 해결했다는 글 없이 해답을 찾는 글만 가득했다. 용량이 커지면 문제가 있으니까 파일을 분할해서 해결했다는 글도 있었으나 이것은 근본적인 해결책이 아니었다.

 

그러다가 인상적인 부분이 있었는데, Edge에서 OpenGL 설정을 켰더니 된다는 말이었다.

그렇다고 Edge로 넘어가기는 좀 그렇고.. OpenGL을 웹에서 사용하는 게 WebGL이라고 알고 있었기에 (이건 조만간 정리해봐야할 것 같다.) 이미 WebGL 관련 옵션을 켜놨는데 왜 Edge는 되고 Chrome만 안되는 걸까라고 생각해서 다시 chrome://flags로 들어갔다.

 

그런데 스크롤을 내리다가 예전엔 못봤던걸까싶은 옵션을 찾았다. Choose ANGLE graphics backend라는 이 옵션의 기본값은 Default이고, Windows에서는 D3D11이라는 친구가 기본값이란다! 그런데 얘를 OpenGL로 바꿔줄 수 있었고, 그렇게 되면 특히 NVIDIA GPU를 사용하는 환경에서 성능이 향상될 수 있다고 설명하고 있다.

 

그래서 밑져야본전이라는 느낌으로 OpenGL로 활성화한 후, Chrome을 재시작해보았다.

그랬더니 피그마가 무사히 잘 작동한다..!

확대 / 축소를 여러번해도 문제가 없었고, 예전에는 피그마 프로젝트를 열면 본체에서 팬 돌아가는 소리가 크게 들렸는데 GPU의 일하는 양이 늘어나서 그런지 그 소리도 사라졌다.

 

데스크탑 앱 내에서는 해당 옵션을 찾을 수 없어 해결 못했지만, 이것도 비슷한 방법이 있을 것 같다.

 

아무튼 부스트캠프는 끝난지 오래지만 문제를 해결하게 되어서 기분이 좋았다.

같이 Figma 홈페이지에서 해결 방법을 찾아준 GDSC UOS 동료에게 감사의 말을 전한다!