린 피셔는 수많은 창의적인 프로젝트와 연간 포트폴리오 업데이트로 유명한 미국 아티스트입니다.
이 게시물은 Designcember의 일부입니다. web.dev에서 제공하는 웹 디자인을 기념합니다.
린 피셔는 웹 작품으로 유명한 미국인 아티스트입니다. 애리조나의 미술 학교에 다닌 후 소프트웨어 컨설팅 분야에서 디자이너와 CSS 개발자로 일하기 시작했습니다. 그녀는 다양한 분야의 연구를 수행하고, 창의적인 매체로 웹을 실험하며, 재미있는 틈새 웹 프로젝트를 만드는 데 경력을 쌓았습니다. 현재 Netlify에서 광고 소재와 함께 일하고 있습니다. 할머니께 흥미로운 여러 프로젝트에 관해 이야기해 봤어요.
레이첼 웹 디자인 및 개발 과정은 어떻게 진행되었나요?
린: 고등학교 때 친구가 저를 GeoCities를 알려줬어요. '드디어 눈을 뜨고'라는 생각을 했던 기억이 납니다. 웹사이트를 만들 수 있다는 것을 깨달은 순간이었습니다. 제가 열광했던 Phoenix 지역 밴드의 팬사이트가 첫 사이트였습니다. 그 후 몇 년 동안 LiveJournal에서 MySpace 파이프라인을 통해 HTML과 CSS를 익혔으며 현지 밴드와 아티스트를 위한 수많은 사이트를 만들었습니다. 'HTML 제작 어시스턴트'라는 직업을 얻게 될 정도로 많은 것을 배웠습니다. 대학 졸업 후 웹 대행사에서 근무했습니다.
그 후에는 이 일을 하면서 설계 및 개발 커뮤니티를 통해 지식과 리소스를 공유하면서 배웠습니다. 학교에서 미술을 전공하여 창의적인 목소리에 대한 자신감을 키우고 비평을 하게 되었지만 공식적인 디자인 교육은 아니었습니다. 동료와 업계 동료들의 연습과 학습을 통해 시간이 지남에 따라 개선할 수 있었습니다.
Rachel: 단일 div CSS 아트워크를 어떻게 만들기 시작하게 되었나요?
린: CSSConf 2013에서 레아 버루가 험블 국경 반경에 대해 이야기하는 것을 봤습니다. 또 한 번 깜짝 놀랐습니다. 제가 이미 사용하고 있는 CSS 속성에는 예술적 잠재력이 무궁무진한 존재가 많아서 살펴보고 실험하게 되어 정말 기뻤습니다. 집에 가서 WhyAZ를 만들고 CSS로 모든 삽화를 그렸습니다. 당시 각 삽화는 두 개의 HTML 요소로 구성되었습니다 (여러 개의 아이콘 시스템 마크업을 따랐음). 다음과 같습니다.
<div class="icon">
<span class="clock"></span>
</div>
그런 다음 단 하나의 HTML 요소만으로도 일러스트레이션을 얼마나 복잡하게 만들 수 있는지 확인하고 싶었습니다. 여기 저기서 몇 시간만 할 수 있는, 정말 재미있고 극도의 제한이 있는 챌린지였어요. 그래서 도메인을 구입하고 사이트에 추가하기 시작했고 거의 8년이 되었습니다. 매체를 스트레칭하는 동시에 일러스트 스킬을 연습하는 것은 정말 재미있습니다.
Rachel: 멋진 프로젝트가 정말 많으시군요. 항상 머릿속에 빌드하고 싶은 것이 있나요?
린: 감사합니다. 나는 관심 있는 일, 주목하기 시작한 패턴, 내가 좋아하는 TV 프로그램, 영화 등 재미있는 프로젝트를 만들 수 있는 대략적인 아이디어를 억지로 쌓습니다. 아이디어를 명확한 프로젝트로 바꾸는 데 시간이 오래 걸릴 때가 있습니다. 이전에 '실제 영화 속 가짜 영화'를 겪었어 Nestflix 가짜 스트리밍 서비스가 실행 가능한 프로젝트로 개발되기 몇 년 전부터 제 백로그에 있었어요. 저는 일정을 짜지 않지만, 할 일을 새로 해야 할 때면 떠오르는 아이디어가 있습니다.
레이첼: 연례 새로고침이 특별한 이벤트로 자리 잡았습니다. 지금 이 작업을 해야 한다는 부담감을 느끼나요, 아니면 여전히 즐거운가요?
<ph type="x-smartling-placeholder">
린: 여전히 정말 재미있고 기대되는 프로젝트죠. 내가 원하는 만큼 이상하게 만들 수 있는 단 하나의 프로젝트예요. 실험하고, 새로운 것을 시도하고, 한 해 동안 관심을 끌었던 새로운 기법을 배울 수 있는 좋은 기회입니다. 그리고 매년 교체되기 때문에 변화에 대처하는 능력을 강화하는 데 큰 도움이 되었습니다. 특정 버전에 친밀감을 느끼더라도 계속 진행할 수 있습니다.
그래도 부담스러워! 각 버전이 이전 버전보다 더 창의적이고 혁신적이어야 한다고 느껴지기 쉽습니다. 스트레스가 될 수 있습니다. 하지만 의욕을 북돋우고 고마워요. 저에게는 시간과 에너지가 남아 있지만, 앞으로도 계속 기준을 높이려고 노력하겠습니다.
레이첼: 최근에 Netlify에서 일하기 시작했는데 고객 업무에서 제품 작업으로의 전환은 어떠셨나요?
린: 저는 Netlify의 마케팅 디자인팀에서 일하고 있습니다. 여러 면에서 제품팀을 위한 대행사 업무와 비슷합니다. 가장 큰 차이점은 큰 그림을 훨씬 더 많이 볼 수 있다는 것입니다. 프로젝트를 진행하기 위해 외부 대행사로 고용된 경우 이러한 특정 목표와 일정에 대한 보기가 제한될 수 있습니다. 그렇다고 나쁜 것만은 아닙니다. 집중은 매우 중요합니다. 제품 회사에 들어가면 많은 정보를 볼 수 있으며, 비즈니스의 여러 부분이 어떻게 함께 작동하는지, 경쟁 목표에 대한 우선순위가 어떻게 지정되는지, 개별 프로젝트가 장기적인 수익 및 성장 목표에 어떻게 기여하거나 기여하지 않는지를 확인할 수 있습니다.
외부 대행사에서 사내 팀으로 일을 한 것 같네요. 다양한 고객 업무 제안이 마음에 들지만 플랫폼인 Netlify와 Jamstack 생태계를 심도 있게 이해하는 것은 재미있었습니다.
레이첼: CSS에 어떤 기능이 추가되기를 원하시나요?
린: 제가 항상 원했던 많은 것들이 적극적으로 노력하고 있어요. 정말 멋지죠. 컨테이너 쿼리와 :has() 유사 클래스가 목록 상단에 있습니다.
보간 타임라인은 매우 유용할 것처럼 느껴집니다. Scott Kellum은 최근 반응형 실험을 진행하면서 겪었던 몇 가지 문제를 해결하는 데 이러한 방법이 어떻게 도움이 될 수 있는지에 대해 이야기했습니다. 정말 멋진 기능이죠.
명시적으로 설정되지 않은 경우 JavaScript에서 요소의 높이를 알려주는 경우가 많으므로 CSS가 단독으로 이 작업을 수행할 수 있다면 더 좋을 수 있습니다. 하지만 확실히 복잡할 것 같아!
레이첼: 지금 웹에서 정말 흥미롭거나 재미있거나 창의적인 작업을 하는 사람은 누구인가요?
린: 많은 사람들이 즐겁게 일하고 있어요. 내가 최근에 좋아하는 것:
- Neal Agarwal의 neal.fun은 재밌는 웹 프로젝트의 보물 창고입니다.
- 저는 캐시 에반스의 재미있고 창의적인 SVG 작업을 좋아합니다.
- Jhey Tompkins는 정말 재미있는 CSS 데모를 만듭니다.
- 저는 Stephanie Eckles의 Style Stage (차세대 CSS Zen Garden) 프로젝트를 좋아합니다.
- 벤 에반스와 다이아나 스미스의 놀라운 CSS 아트워크입니다.
- Charlie Gerard는 핸즈프리와 모션 제어가 가능한 멋진 데모를 제작하고 있습니다.
- 조지 프란시스는 아름다운 AI 생성 아트워크를 만들고 있습니다.
린의 포트폴리오 웹사이트(lynnandtonic.com)나 트위터에서 팔로우하여 다음 번에 어떤 콘텐츠를 만들고 있는지 알아보세요.