🗣 CUSE ME_iOS 💻

발달장애인을 위한 카드형 의사소통도구, 큐즈미

---

발달장애인들에게 세상은 넓고 깊은 바다와 같습니다.
말이 통하지 않는 사람들로 가득한 세상은 그들에겐 함부로 나아가기 어렵고, 무서운 곳이니까요.
우리는 발달장애인들도 넓은 세상을 자유롭게 헤엄칠 수 있기를 바랍니다.
우리와 최소한의 의사소통이 가능하다면, 발달장애인의 세상도 조금은 넓어지지 않을까요?

💕	약자가 배제되지 않는 세상을 꿈꿉니다.
일상에서 말이 통하지 않는다는 이유로 세상을 포기하지 않았으면 좋겠습니다.

💕	이 앱을 마주할 모든 사용자를 생각했습니다.
발달장애인 뿐만 아니라 보호자, 이 앱을 마주할 비장애인들을 모두 고려한 UX

💕	기존 앱보다 사용성을 높였습니다.
TTS(Text To Speach), 음성 녹음, 카드 공유 기능

---

SOPT 25th APPJAM

• 개발 기간 : 2019년 12월 24일 ~ 2020년 1월 4일

📄 Service Work Flow

📱 실행 화면

• 발달장애인 홈 (카드 클릭 전)

• 발달 장애인 홈 (카드 클릭)

• 관리자 모드

• 사용자 홈 (카드 데이터 존재)

• 사용자 홈 (카드 데이터 없음)

• 사용자 홈 Custom Tabbar

• 카드 내려받기

• 카드 추가

• 설정

🖥 개발 환경 및 사용한 라이브러리

개발 환경

• Swift 5
• Target OS : iOS 11~

사용한 라이브러리

• Kingfisher (5.8.3) : S3 저장소 URL 로부터 이미지를 다운로드하고 캐싱하기 위한 라이브러리

  let url = URL(string: "https://example.com/image.png")
  imageView.kf.setImage(with: url)
  

• Alamofire (4.9.0) : Swift 로 작성된 HTTP 네트워킹 라이브러리

   func userName(completion: @escaping (ResposeObject<User>?, Error?) -> Void) {
  let id = "example"
  let url = URL(string: "https://example.com/user/id")
  Alamofire.request(url, method: .get, parameters: nil, encoding: JSONEncoding.default, headers: nil)
  .responseJSON {
  response in
  switch response.result {
  case .success:
  if let data = response.data {
  do {
  let decoder = JSONDecoder()
  let result = try decoder.decode(ResponseObject<User>.self, from: data)
  completion(result, nil)
  } catch (let error) {
  print("getMyRentalList(catch): \(error.localizedDescription)")
  completion(nil, error)
  }
  }
  case .failure(let e):
  print("getMyRentalList(failure): \(e.localizedDescription)")
  completion(nil, e)
  }
  }
  }
  

• lottie-ios : 벡터 기반의 애니메이션을 JSON으로 랜더링하고 실시간으로 동작하게하는 라이브러리

📋 기능 소개

기능	개발 여부	기타사항	담당
Lottie	○	Home 화면 배경	이승언
카드 정렬	○	사용자 설정, 빈도, 이름	이승언,신유진
음성 재생	○	음성 데이터가 있을 경우	이승언
TTS	○	음성 데이터가 없을 경우 텍스트를 바탕으로 생성	이승언
Pinch	△	카드 크기 확대 및 축소	이승언
카드 관리	○	삭제, 숨김 (다중 선택 가능) / 수정	이승언
카드 순서 변경	○	카드 Drag & Drop	이승언
카드 검색	○	카드 제목 및 내용 검색	이승언,신유진
카드 다운로드	△	일련번호를 이용하여 다운로드	이승언, 뷰:신유진
새 카드 생성	○		이승언,뷰:신유진
이미지 추가	○	새 카드 생성시 카메라롤에서 사진 추가	이승언
카드 수정	△		이승언
음성 녹음	○	서버에 파일 저장	이승언
음성 스트리밍	○		이승언
설정 정보 변경	○	연락처, 비밀번호 업데이트	이승언, 뷰:신유진
UUID generator keychain	○		이승언

🔎문제점과 해결방안

• 사용자 홈의 가운데 floating menu 문제 Tabbar Controller를 Customize시켜 해결 HomeHelperTabBarController.swift

• collectionview delegate 에서 tts나 음성 메모가 출력 중일 때 중복으로 셀이 터치되는 문제

guard !synthesizer.isSpeaking && !streamingPlayer.isPlaying else { return }
extension AVPlayer {
var isPlaying: Bool {
return rate != 0 && error == nil
}
}

• 녹음 중 시간 Progress bar Customize 하기

override func viewDidLoad() {
super.viewDidLoad()
//init path
let circularPath = UIBezierPath(arcCenter: .zero, radius: 43, startAngle: 0, endAngle: 2 * CGFloat.pi, clockwise: true)
//Draw the Circle
timeLayer.path = circularPath.cgPath
timeLayer.strokeColor = UIColor(red:251/255, green:109/255, blue:106/255, alpha:1.0).cgColor
timeLayer.lineWidth = 2
timeLayer.strokeEnd = 0
timeLayer.lineCap = CAShapeLayerLineCap.round
timeLayer.fillColor = UIColor.clear.cgColor
timeLayer.position = CGPoint(x: 188, y: 723)
timeLayer.transform = CATransform3DMakeRotation(-CGFloat.pi / 2, 0, 0, 1)
backgroundLayer.position = CGPoint(x: 188, y: 723)
backgroundLayer.path = circularPath.cgPath
backgroundLayer.lineWidth = 2
backgroundLayer.fillColor = UIColor.clear.cgColor
backgroundLayer.strokeColor = UIColor(red:229/255, green:229/255, blue:229/255, alpha:1.0).cgColor
//add layers to view
view.layer.addSublayer(backgroundLayer)
view.layer.addSublayer(timeLayer)}

😁 개발

👩🏻‍💻 신유진

👨🏻‍💻 이승언