기초부터 실전까지! 모바일 UX/UI 디자인 완성

아토믹 컴포넌트 시스템을 활용하여 MVP를 기획부터 디자인까지 완료 해 보는 클래스입니다. 디자인 컴포넌트를 이해하고 활용할 수 있게 됩니다.

댜양한 예제를 통한 앱 UX UI GUI 디자인 실무를 마스터 할수 있습니다.

이 강의에서는 AI 프로덕트를 기획하고 디자인할 때 필요한 UX 원칙과 실전 노하우에 대해 알려드립니다. 사용자 가치 중심의 AI 활용법, AI를 활용한 UX 기획 및 디자인 방법, 일상 속 디자인 사례를 통해 알아보는 핵심 UX 원칙과 이론, 더 나은 경험을 제공하기 위한 UX 리서치 및 데이터 분석법에 대해 살펴봅니다.

Figma디자인 + AI활용코딩 + 배포까지 풀스택 코스!! [피그마 + 바이브코딩 (HTML/CSS/Tailwind/React) + Git + vercel 배포] 내 디자인 그대로!! 1픽셀도 오차없이 바이브코딩으로 완성! AI활용으로 실무 생산성을 5배 높이는 풀스택 공략집! 디자인도 코딩도 모두 가능한 풀스택 디자이너, 당신도 될 수 있습니다. ✅ 내 디자인의 의도까지 한 픽셀의 오차 없이 구현 ✅ AI가 이해하는 디자인 설계 ✅ AI를 정확하게 통제하는 프롬프트 제작능력 ✅ AI가 맘대로 작성한 코드 척척 수정능력 디자인부터 코딩 배포까지 1/5로 단축되는 놀라운 경험을 느립니다.

After Effects 중급 이상, 실무에서 활용할 수 있는 기술을 설명합니다. CC2023으로 설명하지만 버전에 상관없이 기본 원리를 위주로 했습니다. 도구 설명으로 시간을 버리지 말고 능동적인 연구를 할 수 있는 꺼리를 만들어 놓았습니다.

퍼블리셔 취업과 퍼블리셔 실무에서 가장 경쟁력이 있는 모바일 웹 제작 능력을 향상할 수 있습니다. 퍼블리셔로서 모바일 웹을 제작하기 위한 거의 모든 제작 방법과 노하우를 다질 수 있습니다. 특히 요즘 퍼블리셔와 개발자에게 요구되는 디자인 능력을 피그마(Figma) 학습으로 많은 부분 커버할 수 있도록 피그마(Figma)로 모바일 웹 UI 디자인 작업을 하는 과정도 상세하게 설명하였습니다. 모바일 웹 퍼블리싱 수업에서 가장 강점인 부분인 HTML 와이어프레임 상세한 작성법을 모든 페이지 하나하나 상세하게 설명합니다. 강의를 통해 HTML 와이어프레임 제작 능력이 크게 향상될 것입니다. 모바일 웹 퍼블리싱은 CSS 변수(Var) 활용한 모바일과 태블릿에 맞춘 레이아웃을 완벽하게 맞추는 학습을 통해서 실무 작업과 대동소이한 정도의 작업 능력을 갖추게 됩니다. Flex 레이아웃을 중심으로 중상급 CSS 실전 능력을 충분히 갖추시게 됩니다.

리서치 자동화부터 백엔드 데이터 연동, 나아가 실제 라이브 동적 웹을 배포하는 과정까지 함께 다루며 개인이 제품의 전체 생애 주기를 주도적으로 이끌 수 있는 풀스택 관점을 기르는 데 목적이 있습니다. AI 시대 경쟁력을 강화하고 싶은 분들께 생각을 현실화 하는 강력한 엔진으로 활용하는 힘을 드립니다.

이제 AI의 힘으로 누구나 쉽게 앱을 기획하고 UI를 그릴 수 있습니다! 코딩 몰라도, UI 경험 없어도 괜찮아요. Claude, ChatGPT 같은 AI 도구가 여러분의 아이디어를 현실로 만들어 드립니다. 단 몇 번의 질문만으로 타겟 고객을 분석하고, 앱 구조를 설계하고, 심지어 UI 화면까지 자동으로 생성할 수 있어요. 이 강의에서는 피그마를 처음 만져보는 분도 따라할 수 있도록 기초부터 차근차근 알려드립니다. 직접 손으로 그리지 않아도 HTML to Design 플러그인으로 기존 웹사이트 UI를 한 번에 가져올 수 있고, 구글 스티치나 readdy.ai 같은 AI 도구로 몇 초 만에 완성도 높은 화면을 만들 수 있어요. 창업을 꿈꾸는 분, 기획자로 전직하고 싶은 분, 개발자와 소통하고 싶은 분 모두에게 딱 맞는 강의입니다. 복잡한 이론 대신 바로 써먹을 수 있는 실전 노하우만 쏙쏙 뽑아서 알려드릴게요. 이제 아이디어만 있으면 누구나 앱 서비스를 기획할 수 있습니다!

"이렇게 바쁜 세상, AI를 활용해서 포트폴리오를 빠르게 만들 수 있다고?" 문제 정의부터 리서치 정리, 아이데이션, 프로토타이핑까지! AI를 실전 파트너로 활용해 완성도 높은 UX/UI 포트폴리오를 빠르게 만들어봐요. 최신 AI 툴은 물론, 실무에서 꾸준히 쓰이는 검증된 툴까지 프로젝트에 맞게 전략적으로 활용할 수 있어요.

html,css, javascript(jquery) 기초가 있으신가요? 그런데 전체 웹사이트 전체를 어떻게 만들지 잘 모르시나요? 그렇다면 디자인을 참조해서 쇼핑몰 메인페이지 구현을 도전해보세요. 완성된 디자인을 참조하고 기획 의도와 디자인의 상세한 사항들을 파악하여 웹사이트를 구현하는 노하우를 알려드립니다.

예쁜 화면 100개보다 움직이는 프로토타입 1개! 피그마에서 조건부 로직으로 실제처럼 작동하는 프로토타입을 만들고, AI 시대에도 흔들리지 않는 디자인 사고력을 기르세요.

[불필요한 자본 투자를 배제하고 '숨겨진 공장'의 기회비용을 실질적 수익으로 전환하는 공정 최적화 로드맵] 1. 서론: 지능형 공정으로의 전이와 표준 업무 절차의 선결 요건 현대 기업이 인공지능(Artificial Intelligence, AI) 기술을 도입하여 비즈니스 가치를 극대화하기 위해서는, 현장의 물리적 공정과 업무 절차의 엄밀한 표준화가 선행되어야 한다. 표준화가 결여된 비정형 데이터 환경 위에 구축된 지능형 시스템은 최적의 성능을 발휘하기 어려우며, 오히려 프로세스의 불확실성을 증폭시켜 시스템 전반의 리스크로 작용할 가능성이 농후하다. 본 교육 과정은 이른바 '비가시적 공장(Hidden Factory)' 내에 잠재된 수익원을 발굴하고, 이를 인공지능이 자율적으로 통제 및 최적화할 수 있는 공학적 기반으로 전환하기 위한 전략적 방법론을 제시하고자 한다. 2. [분석] 정량적 데이터 기반의 현장 실태 진단 및 '임계 지표의 기저 손실' 분석 상당수의 제조 현장은 표면적인 성과 지표에 안주함으로써 잠재적인 가동 손실을 간과하는 경향이 있다. 공학적 분해(Decomposition) 기법을 통해 종합 설비 효율(Overall Equipment Effectiveness, OEE)을 정밀 분석할 경우, 다음과 같은 구조적 손실이 식별된다. 가용성(Availability) 90%: 설비의 외형적 가동 시간은 확보되었으나, 미세 중단(Minor Stoppage)에 따른 동력 소실이 지속적으로 발생하고 있다. 성능 효율(Performance) 90%: 이론적 사이클 타임 대비 실제 속도의 저하가 상시화되어 있으나, 이를 인지하고 개선하기 위한 기준점이 부재한 상태이다. 양품률(Quality) 90%: 10%에 달하는 불량률은 공정 전체의 신뢰도를 저해하는 치명적인 수치로 평가된다. 위 세 지표의 승수 효과(Multiplier Effect)로 산출되는 실질 종합 설비 효율은 72.9%에 불과하며, 나머지 27.1%의 기회비용은 데이터로 명확히 규명되지 않는 '비가시적 공장' 내에 매몰되어 있다. 따라서 인공지능 도입의 일차적 과제는 이러한 낭비의 근원을 정량화하여 공정의 투명성을 확보하는 것이다. 3. [비판] 전략적 우선순위의 재정립: 운영 최적화(Operational Excellence, OPEX)와 자본 투자(Capital Expenditure, CAPEX)의 상충 관계 생산성 저하에 대한 해법으로 신규 설비 증설(Capital Expenditure, CAPEX)을 우선적으로 검토하는 것은 전략적으로 위험한 판단이 될 수 있다. 종합 설비 효율이 60~70% 수준에 머무르는 저효율 구조에서의 라인 증설은 근본적인 비효율성을 복제하는 결과를 초래하며, 이는 관리 비용의 기하급수적 증가로 귀결된다. 대규모 자본 투입에 앞서 기존 자산의 물리적 한계를 돌파하는 운영 효율성(Operational Excellence, OPEX)의 극대화가 선행되어야 한다. 월드클래스 기준인 OEE 85%를 달성할 수 있는 표준 업무 절차가 수립될 때, 비로소 인공지능과의 결합을 통해 추가 투자 없이 생산 능력을 획기적으로 향상시키는 선순환 구조를 구축할 수 있다. 4. [평가] 데이터 아키텍처의 통합: ISA-95 기반의 의사결정 체계 확립 전사적 자원 관리(Enterprise Resource Planning, ERP)의 재무적 지표와 제조 실행 시스템(Manufacturing Execution System, MES)의 가동 데이터 간의 단절은 정보의 왜곡과 의사결정의 지연을 유발하는 핵심 원인이다. 이를 해소하기 위해 국제 표준인 ISA-95 아키텍처를 적용하여 경영 전략과 물리적 생산 현장을 유기적으로 통합한다. 단일 진실 공급원(Single Source of Truth)의 구축: 현장의 모든 동특성 데이터가 전사적 관리 체계와 실시간으로 동기화되는 데이터 파이프라인을 완성한다. 지표의 재무적 가치 치환 평가: 현장의 미세 정지 시간이 실제 재무제표상의 영업이익과 현금 흐름에 미치는 영향을 직관적으로 연결함으로써, 데이터에 기반한 객관적인 성과 평가 및 의사결정 체계를 수립한다. 5. [실행] 지능형 공정 관리를 위한 4단계 전략 로드맵 엄격하게 표준화된 절차를 기반으로 인공지능 기술과 인간의 공학적 통찰을 융합하는 고도화 전략을 이행한다. 예측 보전(Predictive Maintenance) 및 P-F Interval 활용: 설비 고장의 전조 현상인 잠재적 결함(Potential Failure)에서 기능적 실패(Functional Failure)에 이르는 구간(P-F Interval)을 실시간으로 모니터링하여 예지 보전 시스템을 구축한다. 디지털 트윈(Digital Twin) 기반 시뮬레이션 및 시행착오의 최소화: 공정 변경 시행 전 가상 환경 내에서 다양한 시나리오를 검증함으로써, 물리적 손실을 차단하는 Zero-Trial 전략을 실천한다. 6대 로스(6 Big Losses)의 정량적 제어: 설비 고장, 작업 준비, 공회전, 속도 저하, 공정 불량, 재작업 등 수익성을 저해하는 6대 핵심 낭비 요인을 인공지능을 통해 상시 추적 및 관리한다. 전사적 생산 보전(Total Productive Maintenance, TPM)의 디지털 고도화: 현장 작업자가 설비의 이상 징후를 자발적으로 감지하고 대응하는 능동적 문화를 정착시켜, 인간 참여형(Human-in-the-Loop) 시스템의 신뢰성을 제고한다. 6. 결론: 표준화된 시스템 아키텍처를 통한 기술 주도권 확보 기술적 지식은 교육을 통해 전수될 수 있으나, 공정의 흐름을 장악하는 통찰은 오직 정교하게 설계된 표준 시스템 위에서만 발현된다. 본 마스터클래스는 귀사의 생산 현장을 지능형 자산으로 전환하기 위한 정밀한 공학적 설계도를 제공하고자 한다. 표준화된 업무 절차의 확립과 데이터의 무결성 확보는 인공지능 시대를 맞이하는 필수적인 선결 과제이다. 확고한 시스템적 토대 위에서만 인공지능은 비로소 기업 성장을 견인하는 진정한 지능형 생산 현장으로 작동할 것이다.

구현하고 싶은 앱/웹 아이디어는 있지만, 앱 서비스 기획 경험이 없어 어떻게 시작해야 될지 막막한 스타트업 대표, 단기간에 기획을 체계적으로 배우고 싶은 실무자, 경력자의 기획 업무 프로세스와 노하우를 배우고 싶은 주니어 기획자 모두 전문가가 될 수 있도록 Figma를 활용한 새로운 기획 방식 및 PM 17년차의 업무 스킬을 기초부터 차근차근 알려드립니다.

확실한 화면구현 방법에 대한 이해와 쉽고 빠른 방법을 누구보다 많은 프로젝트 경험을 통한 노하우를 정리해 강의로 만들었습니다.

AI 기술과 UX 디자인이 결합하는 AX 시대, 제품팀은 어떤 전략으로 고객 경험을 설계해야 할까요? 17년차 대기업 책임연구원이자, HCI 박사 출신의 지식공유자가 최신 트렌드와 활용 사례, 연구 결과를 기반으로 알려 드립니다.

데이터 분석가도 없고 유저 리서처도 없는 작은 스타트업을 일곱 군데나 다니며 다양하게 삽질을 했습니다. UX를 설계하는 사람이 겪을 수 있는 여러 가지 현실적인 어려움과 그 어려움을 헤쳐나가는 과정에서 얻은 진한 인사이트를 공유할게요.

서자영 님, 키키 님, 강영화 님이 그동안 커리어에서 겪은 사례를 바탕으로 셀프 성장법과 소프트 스킬에 대해 이야기해요.