[SSAFY] 11기 2학기 자율 프로젝트 (+ 우수팀 선정)

안녕하세요. 11기 SSAFYcial 입니다😁

싸피 2학기가 되고 공통 프로젝트, 특화 프로젝트에 이어 자율 프로젝트까지 끝이 났네요.

다들 반년 동안 세 번의 프로젝트를 하시느라 고생 많으셨고 앞으로 좋은 일만 남으셨길 바랍니다 :)

그럼 제가 진행한 자율 프로젝트의 소개와 회고를 시작하겠습니다!

 

📍 기획

저희 팀의 기획은 한 팀원의 아이디어로부터 시작되었어요. 한 팀원이 대학 시절 학부연구생을 했었고, 그때 느꼈던 불편한 점을 우리 프로젝트로 해결하고자 했어요.

그래서 저희 프로젝트의 대상자는 AI 개발자예요.

블록 코딩으로 쉽고 간편하게 AI 모델을 만들고 학습과 분석까지 함께 할 수 있도록 하고자 했어요.

 

 

📍 프로젝트 소개

🔹 주제

블록 코딩 방식의 AI 모델 개발 소프트웨어

• 🤖 손쉬운 AI 모델 개발
• 📊 한 눈에 보이는 모델 분석
• 🚀 간편한 배포

저희 소프트웨어명은 Ai BLock Editor에서 따온 ABLE이에요 :)

 

🔹 주요 기능

📚 사용자 가이드 제공

ABLE은 처음 사용하는 사용자에게 편의성을 제공해 주기 위해 사용자 가이드(Docs)를 제공해요.

 

🧩 블록 코딩

ABLE은 블록을 활용한 직관적인 시각적 인터페이스를 통해 사용자들이 딥러닝 모델을 설계할 수 있도록 도와요.

데이터 전처리, 레이어 추가, 활성화 함수 선택 등 다양한 작업을 유연하게 수행할 수 있으며, 설계 과정을 간소화해 효율성을 극대화해요.

결과적으로 직관적 설계, 유연한 조합, 효율적 관리를 통해 모델 설계에 집중할 수 있는 최적의 환경을 제공하고 있어요.

원하는 블록을 찾아 드래그앤드롭으로 캔버스에 끌어올 수 있어요.

블록 조회, 추가, 연결, 삭제가 가능하며 한 번에 여러 개의 블록을 선택할 수도 있어요.

 

✅ 유효성 검증

ABLE은 유효성 검증 기능을 통해 블록 코딩 작업의 안정성을 보장해요.

사용자가 블록을 연결할 때 연결성을 자동으로 확인하며, 모델 구성 과정에서 순환(cycle) 생성 방지를 통해 설계 오류를 사전에 차단하고 있어요.

이를 통해 정확하고 신뢰성 있는 모델 설계를 지원해요.

위의 화면을 확인하면 블록이 Data 블록(root)과 연결되어 있는지에 따라 투명도가 달라요.

또한, 연결과 상관 없이 현재 선택 중인 블록은 눈에 띄게 표시했어요.

Data 블록으로의 연결이 불가하고, 사이클 생성 위험이 있으면 블록 연결이 차단되는 걸 볼 수 있어요.

 

📝 모델 학습

ABLE은 사용자가 생성한 블록 모델을 통해 효율적인 자동화 학습 프로세스를 제공해요.

학습 과정은 데이터 전처리, 모델 구성, 손실 함수 및 최적화 설정, 학습 실행, 결과 저장 등의 단계를 포함하며, 모든 과정을 체계적으로 관리해요.

• 자동화된 학습 실행 및 로깅
  • 학습 요청이 들어오면 ABLE은 연결된 블록을 바탕으로 모델을 생성하고, 데이터를 전처리하며 학습을 진행해요. 학습 중에는 각 에포크의 정확도, 손실, 모델 체크포인트를 기록하고 최적의 모델을 저장해요.
• 모델 평가 및 결과 시각화
  • 학습 완료 후 테스트 데이터셋을 사용해 모델을 평가하고, 혼동 행렬, 정확도, F1-스코어 등의 결과를 생성해요. 혼동 행렬 시각화와 성능 지표 저장을 통해 학습 결과를 명확히 확인할 수 있어요.
• 결과 저장 및 관리
  • 학습 중 생성된 전처리 파이프라인, 메타데이터, 하이퍼파라미터, 모델 그래프, 학습 결과 파일 등은 자동으로 관리 및 저장되어 사용자가 추후 쉽게 활용할 수 있도록 지원해요.

 

🔎 모델 분석

ABLE은 사용자가 학습을 완료한 딥러닝 모델을 직관적이고 간편하게 테스트할 수 있는 기능을 제공해요.

다음과 같은 세부 기능을 통해 모델의 내부 동작 과정을 이해하고, 성능을 분석하며, 최적화를 위한 인사이트를 제공하는 데 도움을 줘요.

• 이미지 업로드 및 추론
  • 사용자는 단일 이미지를 업로드하여 버튼 클릭만으로 모델 추론을 수행할 수 있어요.
• 피처맵 시각화
  • 각 레이어 블록의 피처맵을 통해 모델이 입력 데이터를 어떻게 변환하며 특징을 추출하는지 세부적인 필터링 과정을 확인할 수 있어요.
• 히트맵 분석
  • 마지막 활성화 함수 블록에서는 히트맵 시각화를 통해 이미지의 특정 영역이 모델의 분류 결정에 어떻게 기여했는지 명확히 확인할 수 있어요.

 

🚀 모델 배포

ABLE은 버튼 클릭만으로 FastAPI 프레임워크 기반의 서버를 실행하고, 실시간 로그 확인 기능을 제공해요.

또한, 사용자가 생성한 모델을 API로 생성하여 모델 배포 및 활용을 손쉽게 지원해요.

• 손쉬운 배포 및 관리
  • 사용자는 간단한 인터페이스를 통해 서버를 실행하거나 종료할 수 있으며, API를 추가 및 삭제하거나 배포된 API 목록을 조회할 수 있어요. 이를 통해 사용자가 만든 모델을 쉽고 빠르게 배포하고 활용할 수 있어요.

 

📍 프로젝트 회고

저는 프로젝트에서 프론트엔드를 담당했기에 프론트엔드 입장에서 작성했어요.

• React Flow 라이브러리 활용
  • 아마 캔버스의 기능을 0부터 모두 구현하려고 했으면 자율 프로젝트에서 주어진 시간만으로는 부족했을 거예요. 개발 시간으로만 보면 약 3주 정도의 시간뿐이었거든요.
  • 그래서 React Flow라는 라이브러리를 활용하여 캔버스를 더 빠르게 구현했어요. 하지만 저희 프로젝트는 일반 캔버스가 아닌 AI 모델을 위한 블록 코딩 캔버스이기 때문에 그대로 사용하기엔 다른 점이 많았어요.
  • React Flow를 커스텀해서 저희 프로젝트에 맞게 활용했어요. 물론, React Flow에서 지원해 주는 것이 많아 편리하기도 했지만 그렇다고 React Flow만으로 해결할 수 있는 건 전혀 아니었어요. React Flow라는 라이브러리를 이해하고 저희 프로젝트의 요구사항에 맞춰서 구현하는 것이 필요했어요. 이 과정에서 고민을 많이 했고, 라이브러리에 대한 이해를 심화할 수 있었어요.

• FSD(Future Scalable Design) 구조 적용
  • 이전 프로젝트(공통, 특화)에서는 Atomic Design 패턴을 적용했었는데 UI 설계의 체계성과 컴포넌트 재사용 측면에서는 장점이 있었지만, 계층 관리의 복잡성과 오버헤드로 인해 불편함을 느꼈어요.
  • 프로젝트의 확장성과 유지보수성을 고려해 FSD 구조를 도입하여, 도메인별로 폴더를 분리하고 명확한 책임 분리를 통해 코드의 가독성과 관리 효율성을 향상할 수 있었어요.
  • 사실 FSD 구조가 처음이라 적절하게 나눈 건지 잘 모르겠지만, 한 기능 아래 ui, api, constants, types 등의 폴더를 두다 보니 파일 탐색기에서 찾기도 쉬웠어요. Atomic Design을 적용할 때는 한 기능에 대해 보려고 하면 이 파일 찾고 저 파일 찾고 왔다 갔다 하느라 보기 불편했는데 이 점에서 FSD를 적용하면서 훨씬 편했어요.
• Emotion 도입
  • 앞선 두 번의 프로젝트에서 Tailwind CSS를 사용하며 빠른 스타일링이 가능했지만, 유지보수성 부족, 동적 스타일링의 제약, CSS와 로직 분리로 인한 비효율성을 느꼈어요.
  • 이번 프로젝트에서는 Emotion을 도입하여, 스타일과 로직을 통합해 관리하며 동적 스타일링을 유연하게 구현했어요. 또한, 재사용 가능한 스타일(스크롤 없애기, 말줄임표 적용 등)을 정의하여 가독성과 유지보수성을 크게 향상했어요.
  • 하지만 단점이라면.. 제가 이미 너무 Tailwind에 적응해 버려서 처음에 Emotion을 쓸 때 불편하고 오래 걸렸어요.. Tailwind로 하면 그냥 조금 작성하면 바로 적용될 스타일인데, Emotion으로 하려면 일단 변수명부터 고민해야 하고.. 스타일을 하나하나 줘야 하니 이런 게 불편하긴 했어요.
• 캐싱 업데이트
  • 캔버스를 저장할 때, 이전 캐시를 날려서 백엔드에 새로운 캔버스 데이터를 요청할 수도 있었지만, 굳이 백엔드에 요청하지 않고도 프론트엔드에서 변경사항을 반영한다면 더 좋을 것 같았어요.
  • 그래서 TanStack Query의 setQueryData를 활용하여 캐싱 업데이트를 통해 백엔드에 요청을 하지 않고도 저장한 캔버스 데이터를 바로 반영했어요.

 

📍 결과

아쉽게도 이번엔 1등은 못하고, 3등을 해서 우수팀에 선정되었습니다 :)

싸피에서 한 관통, 공통, 특화, 자율, 4개의 프로젝트 모두 뭐라도 받고 나가게 되다니 영광이에용.

2학기 와서 프로젝트는 잠 줄여가며 정말 열심히 했는데.. 그에 비해 취준은 많이 못했어요.

다른 분들은 플젝, 취준 모두 놓치지 않고 챙기시는 분들도 많던데(존경해요) 저는 그러긴 좀 힘들었던 거 같아요.

지금 와서 보니 싸피에서 주시는 좋은 기회들 다 날려버린 게 좀 후회가 되기도 하네요.

이후 기수 분들은 저처럼 후회하지 마시고 플젝, 취준 모두 잡으시길 바랄게요!

모두모두 파이팅..🍀🍀

 

---