sukjuhong / PicPuzzle-server

πŸ† 제 2회 코딧 X μ½”μŠ€ μ—°ν•© 해컀톀 '코코톀' - μ΅œμš°μˆ˜μƒ μˆ˜μƒμž‘ <PicPuzzle>πŸ† μ†Œκ°œ νŽ˜μ΄μ§€μž…λ‹ˆλ‹€.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ† 제 2회 코딧 X μ½”μŠ€ μ—°ν•© 해컀톀 '코코톀' - μ΅œμš°μˆ˜μƒ μˆ˜μƒμž‘ πŸ†

퍼즐 이미지

PicPuzzle


λͺ©μ°¨

  1. λŒ€νšŒ μ†Œκ°œ
  2. 기획 μ˜λ„ 및 컨셉
  3. μ£Όμš” κΈ°λŠ₯ μ†Œκ°œ
  4. μ„œλΉ„μŠ€ μ•„ν‚€ν…μ²˜
  5. νŽ˜μ΄μ§€ ꡬ성
  6. 데λͺ¨ μ˜μƒ
  7. κΈ°λŒ€ 효과
  8. 개발 νŒ€ μ†Œκ°œ
  9. 개발 κΈ°κ°„

πŸ”Ž λŒ€νšŒ μ†Œκ°œ

제 2회 COKOTHON은, μˆ™λͺ…μ—¬μžλŒ€ν•™κ΅ 인곡지λŠ₯곡학뢀 ν•™νšŒ 'CODE-IT' X κ΅­λ―ΌλŒ€ν•™κ΅ μ†Œν”„νŠΈμ›¨μ–΄μœ΅ν•©λŒ€ν•™ ν•™νšŒ 'KOSS'μ—μ„œ μ£Όμ΅œν•˜λŠ” μ—°ν•© ν•΄μ»€ν†€μž…λ‹ˆλ‹€. 이번 λŒ€νšŒμ˜ μ£Όμ œλŠ” 'μΆ”μ–΅' μž…λ‹ˆλ‹€.


πŸ’πŸ»β€β™‚οΈ 기획 μ˜λ„ 및 컨셉

1. μΆ”μ–΅ νšŒμƒκ³Ό 곡유

κ²Œμž„μ„ 톡해 μ‚¬μš©μžλ“€μ€ 과거의 μ†Œμ€‘ν•œ μˆœκ°„λ“€μ„ νšŒμƒν•˜κ³  κ·Έ 감정을 λ‹€μ‹œ λŠλ‚„ 수 μžˆμŠ΅λ‹ˆλ‹€.

2. μ‚¬μš©μž μ°Έμ—¬

μ‚¬μš©μžκ°€ 좔얡이 κΉƒλ“  사진을 μ—…λ‘œλ“œν•˜λ©΄ κ·Έ 사진을 쑰각으둜 μ„žμ–΄ 메세지와 ν•¨κ»˜, μ†Œμ€‘ν•œ μˆœκ°„μ„ ν•¨κ»˜ ν•œ μ‚¬λžŒμ—κ²Œ URL둜 전달 ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

3. μ‚¬μš©μž κ°„ μƒν˜Έ μž‘μš© κ°•ν™”

URL을 받은 μ‚¬μš©μžλŠ” 퍼즐 쑰각을 λ§žμΆ”λŠ” 과정을 톡해 좔얡을 μƒκΈ°μ‹œν‚¬ 수 μžˆμŠ΅λ‹ˆλ‹€. μ΄λŠ” ν•¨κ»˜ ν•΄μ„œ ν–‰λ³΅ν–ˆλ˜ μˆœκ°„λ“€μ„ λ‹€μ‹œ λ– μ˜¬λ¦¬λ©° κ°μ •μ μœΌλ‘œ μ—°κ²°λ˜λŠ” νŠΉλ³„ν•œ κ²½ν—˜μ„ μ œκ³΅ν•©λ‹ˆλ‹€.


πŸ’‘ μ£Όμš” κΈ°λŠ₯ μ†Œκ°œ

1. κ°œμΈν™”λœ 퍼즐 생성

μ‚¬μš©μžκ°€ 좔얡이 λ‹΄κΈ΄ 사진을 μ²¨λΆ€ν•˜λ©΄, ν•΄λ‹Ή 사진은 μžλ™μœΌλ‘œ 퍼즐 쑰각으둜 λΆ„ν•΄λ˜κ³  이 퍼즐은 URL의 ν˜•νƒœλ‘œ κ³΅μœ ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

2. 메세지 전달

퍼즐을 μ™„μ„±ν•˜κ³  λ‚˜λ©΄ λ°œμ‹ μžκ°€ 보낸 νŠΉλ³„ν•œ 메세지가 λ‚˜νƒ€λ‚˜λ©°, 곡유된 좔얡듀이 μ™„μ „ν•œ μ΄μ•ΌκΈ°λ‘œ μ™„μ„±λ©λ‹ˆλ‹€.


πŸ›  μ„œλΉ„μŠ€ 아킀텍쳐

μ„œλΉ„μŠ€ 아킀텍쳐


πŸ—‚οΈ νŽ˜μ΄μ§€ ꡬ성

νŽ˜μ΄μ§€ ꡬ성 1

νŽ˜μ΄μ§€ ꡬ성 2

νŽ˜μ΄μ§€ ꡬ성 3


πŸŽ₯ 데λͺ¨ μ˜μƒ

νšŒμ› κ°€μž… 둜그인
νšŒμ› κ°€μž… 둜그인
퍼즐 λ§Œλ“€κΈ° 퍼즐 λ§žμΆ”κΈ°
퍼즐 λ§Œλ“€κΈ° 퍼즐 λ§žμΆ”κΈ°

🌟 κΈ°λŒ€ 효과

1. κ²Œμž„μ„ ν•˜λ©° 좔얡을 λ˜μƒˆκΈ°λŠ” 1석 2μ‘° 효과

퍼즐 쑰각을 λ§žμΆ”λ©° 사진을 μ™„μ„±ν•˜λŠ” κ²Œμž„μ„ μ¦κΈ°λ©΄μ„œ, μ‚¬μ§„μ˜ μ„Έμ„Έν•œ λΆ€λΆ„κΉŒμ§€ μ‚΄ν”Όλ©° 쑰각을 λ§žμΆ°κ°€λŠ” κ²½ν—˜μ„ 즐길 수 μžˆμŠ΅λ‹ˆλ‹€.

2. 이미지 & ν…ŒμŠ€νŠΈ λͺ¨λ‘ κ°•μ‘°

μ‚¬μš©μžλŠ” 퍼즐을 λ§žμΆ”λ©° 각 쑰각에 ν•΄λ‹Ήν•˜λŠ” 좔얡을 λ©”λͺ¨ν•˜κ³  κ³΅μœ ν•  수 있으며, 퍼즐을 λͺ¨λ‘ λ§žμΆ”λ©΄ μΆ”μ–΅ κ΄€λ ¨ 메세지가 좜λ ₯λ˜μ–΄ ν…μŠ€νŠΈκΉŒμ§€ κ°•μ‘°λ©λ‹ˆλ‹€.

3. κ·Έλ¦Ό μš°μ›”μ„± 효과

이미지가 ν…μŠ€νŠΈλ³΄λ‹€ 더 κΈ°μ–΅λ˜κΈ° μ‰¬μš΄ ν˜„μƒμ„ μ˜λ―Έν•©λ‹ˆλ‹€. 이미지λ₯Ό μ‚¬μš©ν•˜λ©΄ κΈ°μ–΅λ ₯이 더 κ°•ν™”λ˜κ³ , 정보가 더 잘 μΈμ‹λ˜λ©°, μž₯κΈ° 기얡에 더 였래 λ‚¨μŠ΅λ‹ˆλ‹€.

4. 정보 λΆ€ν˜Έν™” 효과

μ‚¬λžŒμ€ μ–΄λ–€ 것을 μΈμ§€ν• λ•Œ μ‹œκ°κ³Ό 의미 λΆ€ν˜Έν™”λ₯Ό κ±°μΉ˜λŠ”λ°, 이미지와 ν…μŠ€νŠΈλ₯Ό ν†΅ν•΄μ„œ μΈμ§€ν•˜λŠ” 정보 λΆ€ν˜Έν™”λ₯Ό μ μš©ν•  수 μžˆμŠ΅λ‹ˆλ‹€.


πŸ‘ͺ 개발 νŒ€ μ†Œκ°œ

λ„μŠΉμ€€ ν”„λ‘œν•„ λ₯˜λ―Έμ„± ν”„λ‘œν•„ μ •μ—°μˆ˜ ν”„λ‘œν•„ μ΅œμ„Έμ—° ν”„λ‘œν•„ 홍석주 ν”„λ‘œν•„
λ„μŠΉμ€€
(κ΅­λ―ΌλŒ€ν•™κ΅)
λ₯˜λ―Έμ„±
(μˆ™λͺ…μ—¬μžλŒ€ν•™κ΅)
μ •μ—°μˆ˜
(κ΅­λ―ΌλŒ€ν•™κ΅)
μ΅œμ„Έμ—°
(μˆ™λͺ…μ—¬μžλŒ€ν•™κ΅)
홍석주
(κ΅­λ―ΌλŒ€ν•™κ΅)

Front-end

Front-end

Back-end

Front-end

Back-end & νŒ€μž₯


πŸ“… 개발 κΈ°κ°„

2023λ…„ 12μ›” 26일 ~ 2023λ…„ 12μ›” 27일 (2일)

About

πŸ† 제 2회 코딧 X μ½”μŠ€ μ—°ν•© 해컀톀 '코코톀' - μ΅œμš°μˆ˜μƒ μˆ˜μƒμž‘ <PicPuzzle>πŸ† μ†Œκ°œ νŽ˜μ΄μ§€μž…λ‹ˆλ‹€.


Languages

Language:Java 100.0%