Skip to content

kangdaelyeol/hoonsman

 
 

Repository files navigation

2023 동계 카카오 현장실습 헌터조

Table of contents

  1. 프로젝트 소개/로고
  2. 팀명/팀(원) 소개
  3. 프로젝트 배경/목표
  4. 동작 방식(프로세스)
  5. 개발/배포 환경
  6. 테스트 환경
  7. 시연 영상
  8. 회고
  9. 활용/참고 정보

HoonsLetter Project

사용자가 간단하게 초대장을 만들고 공유할 수 있는 웹 서비스

로고 로고이미지

Team Hoon’s man

Hunter - 조훈 멘토

Harry - 강대렬 팀장

Merlin - 김재형 팀원

JB - 김지혁 팀원

Eggsy - 김한나 팀원

프로젝트 배경 / 목표

배경

팀장 Harry의 mybro 제작 경험을 바탕으로 사용자가 쉽게 원하는 이미지와 문구로 초대장을 커스터마이징하고 공유할 수 있는 웹 서비스 기획

목표

  • 4가지의 초대장 샘플을 제공하여 샘플 디자인을 기반으로 사용자가 원하는 이미지와 문구로 초대장 커스터마이징 서비스 제공

  • Open AI api를 활용하여 사용자가 키워드 입력 시 맞춤 문구 제공

  • 초대장 생성 시 모바일 형식의 URL 배포 서비스 제공

동작 방식

사용자 시나리오

  1. 서비스에 접속합니다.
  2. 사용자는 계정을 생성하거나 로그인합니다.
    1. ID
    2. 구글
  3. 홈화면으로 이동합니다.
  4. 샘플초대장을 확인하고 원하는 샘플을 선택합니다.
  5. ‘초대장 만들기’ 옵션을 선택합니다.
  6. 사용자는 주제에 맞는 키워드를 입력합니다.
  7. ai가 추천하는 문구를 선택하거나 직접 문구를 작성합니다.
  8. 편집 화면으로 이동합니다.
  9. 사용자는 자신이 원하는 디자인으로 초대장을 커스터마이징합니다.
    1. 사진 추가
    2. 글자색, 글자 크기 설정
    3. 적용 버튼을 눌러 확인
  10. 저장(생성)버튼을 눌러 초대장을 저장합니다.
  11. 생성된 초대장 URL을 복사하여 초대장을 공유합니다.
  12. URL을 공유받은 사용자는 URL을 통해 초대장을 확인합니다.

개발 / 배포 환경

개발 환경

  • 프론트엔드 : React.js
  • 백엔드 : Node.js
  • 인공지능 : Open AI Api

배포 환경

테스트 환경

시연 영상

바로가기

회고

활용 / 참고 정보

About

ㅎㄹㅅ

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 72.7%
  • CSS 20.4%
  • HTML 5.5%
  • Python 1.4%