#6 프로토타이핑 집에서 함께 공부해요 - 어도비 XD 강좌

Поділитися
Вставка
  • Опубліковано 24 вер 2024
  • 어도비 XD 여섯 번째 강좌입니다. 이번 강좌에서는 XD에서 프로토타이핑 기능을 배워보겠습니다. 프로토타이핑의 기본인 링크를 걸어줄 요소 선택과 이동할 아트보드를 선택하는 것이죠. 어떻게 사용하는지 배워보고, 드래그와 자동 애니메이트를 활용해서 좀 더 다양한 프로토타이핑을 한번 예제를 통해 배워보세요.
    🌟예제 다운은 멤버십 회원 전용 커뮤니티에 올린 링크에서 받으실 수 있습니다.🌟
    🚀 디자인베이스 멤버십 가입하면 다양한 고급 강좌와 예제 파일을 받아볼 수 있어요 🚀
    ┗ / @designbase
    *디자인베이스 강좌는 Mac OS를 기준으로 해서 윈도우 사용자와 일부 차이가 있을 수 있습니다. 윈도우 사용자분들은 영상에서 커멘드(Cmd)라는 단축키 대신 컨트롤(Ctrl)을, 옵션(Option) 대신 알트(Alt)를 눌러주세요.
    누구나 손쉽게 배우는 디자인 강좌, 디자인베이스입니다. 어도비XD의 첫단추는 디자인베이스에서 시작하세요. XD를 통해 손쉽게 UI 디자인 작업을 할 수 있습니다. : )
    ☞ 디자인베이스 소개 : designbase.co.k...
    ☞ 공식 웹사이트 : designbase.co.kr/
    *BGM 사용 출처
    Track: Syn Cole - Gizmo [NCS Release]
    Music provided by NoCopyrightSounds.
    Watch: • Syn Cole - Gizmo | Hou...
    Free Download / Stream: ncs.io/Gizmo
    Track: NIVIRO ft. PollyAnna - Fast Lane [NCS Release]
    Music provided by NoCopyrightSounds.
    Watch: • NIVIRO ft. PollyAnna -...
    Free Download / Stream: ncs.io/FastLaneYO

КОМЕНТАРІ • 64

  • @dahuii
    @dahuii 2 роки тому

    ㅊㄱㅍ 6:00

  • @supermicky5
    @supermicky5 3 роки тому +3

    와.. 이거 진짜 꿀팁인거같아요 특히 아래에서 올라오는 효과 같은거ㅠㅠㅠ 실무자라서 알려줄 수 있는 멋진 꿀팁!

  • @윤서준-c2y
    @윤서준-c2y Рік тому

    안녕하세요 혹시 윈도우 녹화로 프로토타입을 녹화할때 화질이 별로라 글자가 다깨지더라구요.. 60fps랑 설정값을 높여도 그래서 혹시 방법 있을까요?

  • @김현중-q9f
    @김현중-q9f 4 роки тому +3

    정말 단순하게만 쓰고있었는대 꿀기능이네요! 공부하는대 많은 도움이 되고있습니다 감사합니다

    • @designbase
      @designbase  4 роки тому

      ㅎㅎ잘 사용하면 다양하게 표현이 가능할것같아요!

  • @hee3808
    @hee3808 4 роки тому +4

    예제2번처럼 이미지 슬라이드 방법을 배우고 싶었는데 올려주셔서 너무 감사합니다~!

  • @안둉
    @안둉 3 роки тому

    만들다가 중간에 동선 꼬여서 영상보고 해결했습니다. Alt 눌러서 다시 복제해 볼 생각을 못했네요 ㅋㅋ ㅠㅠㅠ 감사합니다!

    • @designbase
      @designbase  3 роки тому

      ㅎㅎ 화이팅입니다!

  • @숨덕탈출
    @숨덕탈출 4 роки тому +6

    Xd 독학하기에 최고의 영상ㄷㄷ

  • @난다와플
    @난다와플 4 роки тому +1

    최고다 최고.. 잘배웠습니다 감사해용~!

    • @designbase
      @designbase  4 роки тому

      어플로 답장하다보니 놓친 댓글들이 상당히 많네요..ㅠㅠ 감사합니다!

  • @밍끼쓰
    @밍끼쓰 4 роки тому

    안녕하세요 ㅜㅜ 정말 도움 너무많이되고있습니다.

    • @designbase
      @designbase  4 роки тому

      감사합니다 :)

    • @밍끼쓰
      @밍끼쓰 4 роки тому +1

      @@designbase 이번에 온라인으로 비핸스에 졸업전시를 하게됬는데 참고해서 열심히 작업하겠습니다 ㅎ ㅜㅜㅜ

    • @designbase
      @designbase  4 роки тому

      밍끼쓰 졸전 화이팅입니다! 제일 힘들때겠네요ㅎㅎ

  • @김지원-m7h5q
    @김지원-m7h5q 3 роки тому

    진짜 짱,,,,,

  • @hhttt2
    @hhttt2 4 роки тому

    선좋아요 먼저 누릅니다~~

    • @designbase
      @designbase  4 роки тому

      선따봉후감상 감사합니다ㅎㅎ

  • @amumid
    @amumid 4 роки тому

    저기 죄송한데 질문이 ㅜ ㅠ
    xd 프로그램을 이용해서 만든 페이지를 웹브라우져로 실행할수 있게 할수있나요?
    xd는 ui 를 테스트하기 위한 프로그램인가요?
    ..?
    웹사이트
    앱을 만들수는 없나요..?
    물어볼대가 없네요...

    • @designbase
      @designbase  4 роки тому

      Xd는 UI 디자인을 하기위한 툴입니다. 실제 앱이나 웹을 만들기위해서는 개발이 필요합니다ㅎㅎ

  • @강태풍-u5m
    @강태풍-u5m 2 роки тому

    8:16 에서 필요없는 부분은 투명도를 0으로 주셨는데
    그냥 삭제해도 무방한가요??

  • @pigmin95
    @pigmin95 4 роки тому

    좋은 강좌 열심히 보고 있습니다. 좋은 나눔 해 주셔서 정말 감사드립니다. 한 가지 질문을 드립니다. 저는 그래픽 관련 프로그램을 혼자 공부하는 게 취미인데요. 어떻게 하다가 XD를 알게 되어서 현재 배우고 있는 중입니다. 어도비 XD에서 프로토타이핑을 만들어서 정말 스마트폰(ios, 안드로이드)에서 유저가 클릭하여 상호작용을 할 수가 있는 건가요?? 아니면 이렇게 만들어서 별도로 다른 작업을 완료해야만 유저가 해당 기능을 사용할 수 있는건가요?? 아무리 찾아도 export를 하는 부분이 없는 것 같아서 불쑥 질문을 남겨봅니다. 감사합니다.

    • @designbase
      @designbase  4 роки тому +1

      프로토타이핑 작업을 한 xd파일을 클라우드에 업로드를 하면 어도비xd 앱에서 직접 클릭할 수 있습니다. 혹은 프로토타이핑 탭에서 링크로 공유도 가능해요~!

    • @pigmin95
      @pigmin95 4 роки тому

      디자인베이스 감사드립니다.

  • @sksmsvnt
    @sksmsvnt 4 роки тому +1

    유용한 정보 감사합니다!
    Xd공부중인데 사이즈 변경 어떻게 하는지 혹시 알려주실수 있나요? 아이폰11사이즈로 작업했는데 7플러스사이즈로 바꾸고싶어요~

    • @designbase
      @designbase  4 роки тому

      아트보드 사이즈는 우측에 w, h 값을 변경해주셔야 합니다ㅠㅠ

  • @여행작가둘리
    @여행작가둘리 4 роки тому

    프로토타입 연결선을 제거하거나 취소하는 방법 알려주세요.

    • @designbase
      @designbase  4 роки тому

      연결을 취소하는 방법은 연결된 선을 드래그해서 해당 아트보드에서 바깥으로 꺼내면 됩니다ㅎㅎ

  • @구선영-u6m
    @구선영-u6m 3 роки тому

    안녕하세요 앱디자인을 해보려고 유튜브로 xd 강좌를 찾아보고있었는데요
    애니메이션이 실제 개발자들한테 넘어가면서 스크립팅 소스가 구현이 되어져서 반영이 되는건가요?
    예로들어 만들어주신 영상의 6:15 부분처럼 자동 애니메이트처럼 좌우로 이동되는 동작들을 디자이너가 xd로 만들잖아요
    일반 html 웹이라면 저런 동작들은 html, css, 제이쿼리의 조합으로 동작을 구현하는건 알고있는데요
    근데 앱에서는 저렇게 xd로 구현을 해놓고 개발자한테 제플린으로 업무공유로 넘겼을때 모션 스크립팅(?) 소스가 같이 넘어가서 실제 앱 개발에 적용이 되는건지 아니면 이런 이런 모션을 생각하고있으니 구현해주세요~ 정도의 의견전달용인건지 좀 제가 xd의 개념이 없어서 질문을 드립니다

    • @designbase
      @designbase  3 роки тому

      안녕하세요~!ㅎㅎ 스크립트 소스 구현되진않습니다~! 그냥 프로토타이핑이에요. 말씀하신 예 중에 후자에 가깝습니다~! 이런 모션으로 구현해주세요 수준입니다

    • @구선영-u6m
      @구선영-u6m 3 роки тому

      @@designbase 아... 그렇군요 친절한 답변 감사합니다 ^^

  • @뽀밍뿌-q3l
    @뽀밍뿌-q3l 4 роки тому

    안녕하세요! 혹시 한글 웹+앱에 사용하는 폰트는 noto sans kr 말고는 어떤 폰트를 사용하시나요?

    • @designbase
      @designbase  4 роки тому

      안녕하세요~! 스포카 산스도 나름 괜찮은것같아요ㅎㅎㅎ

  • @naranja8379
    @naranja8379 4 роки тому

    ui 포트폴리오에 이런 애니메이션 기능 넣는건 어떻게 해야될까요? gif 파일로 어떻게 할 수 없는건가요?? 검색 키워드도 모르겠어서 댓글로 질문드려요 ㅜ

    • @designbase
      @designbase  4 роки тому

      포트폴리오를 어떤 포맷으로 어디에 올릴지에 따라 다르겠죠ㅎㅎ 애니메이션을 제작 후에 Vimeo에 올려서 임베드 형식으로 불러오거나 gif 사용해서 넣는 방법이 있죠. pdf로 할때는 안됩니다.

  • @냐냐냐-r2z
    @냐냐냐-r2z 3 роки тому

    안녕하세요 혹시 애니메이션효과를 넣었고 이제 그 페이지 내에 글자를 누르면 다른 페이지로 이동하게끔 하고싶은데 애니메이션을 넣은페이지는 글자를 눌르면 다른페이지로 이동하게끔 되어지지않는데 왜 그런건지 알수있나요 ㅠㅠ ?

    • @designbase
      @designbase  3 роки тому

      어떻게 연결하셨는지 잘 모르겠네요ㅠㅠ 텍스트를 누르면 다른페이지로 이동하게 하는건 가능한데, 혹시 연결이 제대로 되어있나요??

  • @user-xq6fw4mz2v
    @user-xq6fw4mz2v 2 роки тому

    프로토타이핑한걸 html로 export하는 방법이 있나요???

    • @designbase
      @designbase  2 роки тому

      프로토타이핑한걸 내보내는 방법은 잘 모르겠네요ㅠㅠ 그런 기능은 못본것같아요

  • @오늘을살자-p6j
    @오늘을살자-p6j 4 роки тому

    우와 개꿀

  • @sullivague
    @sullivague 3 роки тому

    pdf로 아트웍을 내보냈을 클리핑마스크를 적용한 이미지들은 확대되서 내보내지는데 이럴 경우에는 어떻게 해야하나요?..ㅠㅠ

    • @designbase
      @designbase  3 роки тому

      Xd로 아트웍을 만들어본적이 없어서 잘 모르겠네요ㅠㅠ

  • @kimmalgook
    @kimmalgook 4 роки тому

    인스타그램 좋아요처럼 버튼 누르면 팝업이 뜨면서 버튼 상태도 변환되는 건 어떻게 해야하나요?

    • @designbase
      @designbase  4 роки тому

      비포 에프터를 만들고 비포에 팝업과 좋아요 누르기 전 상태로 투명도를 0으로 하면 되겠죠? 비포 에프터에 레이어명이 같게 있다고 생각해보세요

  • @peekk21
    @peekk21 3 роки тому

    영상 잘봤습니다! 혹시 영상 전반에 쓰인 가사 없는 음악 이름과 출처를 알 수 있을까요>

    • @designbase
      @designbase  3 роки тому

      영상에 사용된 음악은 영상 설명란 하단에 적혀있습니다👍

    • @peekk21
      @peekk21 3 роки тому

      기재된 두 노래중에 사용된 브금이 없습니다..!

    • @designbase
      @designbase  3 роки тому +1

      아 도입부가 아니라 혹시 배경음을 말씀하시는걸까요??

    • @designbase
      @designbase  3 роки тому +1

      만약 배경음을 말씀하시는거라면 유튜브 오디오 라이브러리에서 무료로 찾아서 사용했습니다.ㅎㅎ

  • @dong_8643
    @dong_8643 4 роки тому

    안녕하세요 프로토타입툴 질문있습니다. 한페이지에서 다른 페이지로 연결시 그룹(예를 들어 재생목록)과 그룹(예를 들어 재생목록)으로 연결을 원하는데 그룹에서 전체페이지로 계속 연결이 되네요.. 왜이런 증상이 나올까요?

    • @designbase
      @designbase  4 роки тому

      작업한 예시를 보지 못해서 정확히 이해를 못했지만, xd같은 링크 개념의 프로토타입의 기본은 페이지 이동입니다. 페이지(아트보드)의 특정 그룹으로만 이동하는 방법은 없는 걸로 알고 있습니다 ㅠㅠ

  • @kimmalgook
    @kimmalgook 4 роки тому

    최고,,, 구독 좋아요했어요 넘 유용한 영상이네요...!!!!!!

    • @designbase
      @designbase  4 роки тому

      감사합니다!ㅎㅎ☺️

  • @illilllill4002
    @illilllill4002 4 роки тому +4

    xd강좌가 은근 없는데! 꿀팁 감사합니다!

  • @heoreelee9128
    @heoreelee9128 4 роки тому

    와....

  • @snowphiakim2965
    @snowphiakim2965 3 роки тому

    "이해가 되셨죠?"
    나: ㄴ ㅔ??
    "저번에 배웠죠?"
    나: ㄴ ㅔ???
    .....
    여러번 다시 볼게요 잘못했어요

    • @designbase
      @designbase  3 роки тому +1

      ㅋㅋㅋ너무 어렵게 설명드렸나요..ㅠㅠ

    • @snowphiakim2965
      @snowphiakim2965 3 роки тому

      @@designbase 오 아니에요 제가 부족할뿐… 재취업 하려고 하는데 생계가 막막해서 학원다니기도 어려웠는데 XD강좌가 있어서 다행입니다.