개발 못해요! 그냥 못해요

📌 Lifecycle (생명주기)란? 👉 안드로이드 시스템에서 앱이 실행되는 동안 상태 변화를 추적하고 관리하는 방법 👉 자원을 최적화하고 안정적인 사용자 경험을 제공! 📌 생명주기 구성 활동(Activity) 사용자 인터페이스(UI)를 제공하는 구성요소입니다. 액티비티는 앱에서 화면에 보이는 하나의 창. 액티비티는 onCreate(), onStart(), onResume()과 같은 여러 메서드를 가지고 있음. 서비스(Service) 백그라운드에서 실행되는 구성요소. 서비스는 활동이나 사용자 인터페이스를 제공하지 않는다. 대신에, 데이터를 검색하거나, 파일을 다운로드하거나, 음악을 재생하거나, 네트워크에 연결하는 등의 작업을 수행함. 브로드캐스트 수신자(Broadcast Receiver) 안드로이드 시스..

💡그리드 시스템이란? 디자인의 기초적인 구조로, 레이아웃을 조직화하고 정렬하기 위한 체계적인 격자 형태의 구조다 그리드 시스템은 UX/UI 디자인에서 굉장히 중요한 요소다 이는 웹사이트, 앱 또는 디지털 인터페이스의 레이아웃을 일관되고 조직적으로 정리하여 사용자에게 더 나은 경험을 제공하기 위한 도구로 활용된다 일관된 간격과 위치에 배치할 수 있어 일관된 레이아웃 제공하고 일관된 간격과 정렬은 사용자에게 깔끔하고 직관적인 느낌을 전달해 시각적 조화의 효과도 볼 수 있다 프레임을 생성하고 그 프레임의 디자인 패널을 보면 Layout Grid를 찾을 수 있다 여기서 그리드를 설정하면 되는데 + 버튼을 누르면 자동으로 그리드를 생성해준다 보통 저렇게 가로 세로 다 있는 그리드 보다 Columns를 사용한다 C..

✅ 플러그인(Plugin) 피그마의 여러 장점 중 하나는 정말 다양한 플러그인이 있다는 것...! 내 작업물의 퀄리티를 올려주거나 번거로운 작업을 간편하게 해준다 즉 디자인 생산성을 높일 수 있다!! 플러그인은 Tool바에 있고 검색을 통해서 원하는 플러그인을 사용하면 된다 플러그인을 사용하는 경우가 정말 정말 광범위 하지만 일단 가장 많이 쓰는 기능들 위주로 정리해봤다 1️⃣ Iconify 내가 생각했을 때 제일 많이 플러그인을 사용하는 경우 1순위가 아이콘인데 아이콘 직접 만들면 실력이 늘겠지만...! 그치만 이미 많은 아이콘이 잘 나와있기 때문에 특수한 경우가 아니면 여기서 찾아 쓰는게 제일 좋다 다른 플러그인 중에는 하나의 키워드에 하나의 아이콘만 있는 경우도 있는데 Iconify는 진짜 다양한 ..

인터랙션 디자인 첫번째로 자기소개 페이지를 만들어 보도록 할건데 가운데 중심축을 기준으로 회전하는 선이 특징입니다! ✅ 기본 파일 구성 asset 폴더는 이미지 파일을 담고 style 폴더는 sass를 사용할 것이기 때문에 style.scss를 생성하고 저번에 설치했던 라이브러리를 실행하면 자동으로 맵핑되어서 style.css 파일을 생성해줍니다! 자세한 건 아래에서 계속 설명할께요 디자인 툴은 Figma를 이용해서 작업했습니다 전체적인 디자인은 구성입니다 📌 index.html 기본 구성 태그를 이용해 구성을 나누어 주었는데 간단하게 정리하고 가면 html은 다양한 태그가 있는데 그 중 의미론적 태그는 가 있고 이건 그룹핑을 하기 위해 사용하는 태그들이다 가장 첫번째로 배경을 구현하기 위해 class가..

기본 개발 환경 & 플러그인 설치 1. visual studio / html을 이용해서 진행 HELLO 2. Live server 라이브러리 이를 통해 파일의 경로가 아닌 아이피 주소 + 포트 번호 + 파일명으로 보이게 됨 화면에서 바로 업데이트 되는 걸 확인 할 수 있음 3. Live Sass Compiler 원래 css 파일 적용 방식 라이브러리 사용 시 Generated: c:\\Users\\user\\Desktop\\인터랙션 디자인\\style.css.map c:\\Users\\user\\Desktop\\인터랙션 디자인\\style.css -------------------- Watching... -------------------- 항상 CSS만 사용해왔는데 SCSS를 처음으로 사용해본다...!..

💡사용자 경험 이란? 사용자 경험 (User Experience, UX)은 사용자가 어떤 시스템, 제품, 서비스를 직간접적으로 이용하면서 느끼고 생각하게 되는 지각과 반응, 행동 등의 총체적 경험을 말한다 UX의 이해와 관점 인지적 관점 (Congnitive) 인간의 기억과 생각하는 구조의 이해 인간이 어떻게 하나의 정보를 받아들여 인지하고 처리하는가? 감각과 감성 (Emotion) 역동적이고 다면적인 감각능력과 경험발생 시점에서의 심리적 상태와 변화의 이해 어떻게 느끼는가? 사용자 맥락과 상황 경험 발생 상황과 외적 영향 사용자는 컨텍스트의 영향으로 외부 환경과 어떤 관계적 경험을 형성하게 되는가? 사용자 행위 (Behavior) 제품, 서비스 경험릐 물리적, 인지적, 사회문화적 현상의 해석과 상호작용..

💡 styled components 란? JavaScript와 React 또는 React Native를 사용하여 웹 및 모바일 애플리케이션의 스타일을 관리하기 위한 라이브러리! CSS를 JavaScript 파일 내부에 직접 작성하는 방식으로 스타일을 정의하고 적용 ✅ 장점 - styled-components를 사용하면 스타일을 컴포넌트 수준에서 정의할 수 있음 각 컴포넌트에 대한 스타일을 독립적으로 정의하고 재사용할 수 있음 - 컴포넌트와 스타일을 논리적으로 그룹화하고 관리할 수 있음 패키지 설치 $ npm i styled-components 💡 사용 방법 import styled from "styled-components"; styled-components를 import 해줘야 한다 - styled.t..

Activity (액티비티) 안드로이드 애플리케이션의 사용자 인터페이스(UI)를 나타내는 하나의 화면 사용자와 상호 작용하고 화면 간의 전환을 담당 Fragment (프래그먼트) 액티비티 내에서 재사용 가능한 UI 조각 / 단독으로 존재할 수 없음 액티비티 내부에 여러 개의 프래그먼트를 포함하여 하나의 화면을 구성할 수 있음 ex) tab layout 💡 viewBinding 적용하기 앞으로 모든 프로젝트에서 viewBinding을 적용시켜 진행할건데 기존의 findViewById의 문제점들이 개선이 되었고, 속도가 빠르고, 사용이 간편하기 때문이다 1️⃣ build.gradle(Module) 에서 viewBinding 적용 2️⃣ 상단에 Sync Now 클릭 3️⃣ Activity 코드 수정 기존 코드..

📌변수와 상수 변수 let 변수명 = 초기값; ⚠️변수명 규칙 변수명에는 기호 사용 불가 (단, _,$만 사용 가능) 숫자로 시작할 수 없음 js 예약어 사용 불가 let age = 25; console.log(age); //25 age = 35; console.log(age); //35 //let은 똑같은 변수명을 선언했을 때 오류가 뜸 --> var보다는 let을 사용 처음 선언할 때 초기화 시켜주지 않아도 괜찮음! 선언 이후 다른 값으로 덮을 수 있음 상수 const 변수명 = 초기값; ⚠️상수 사용시 주의할 점! const age = 25; console.log(age); age = 35; console.log(age); 변수와 다르게 상수는 첫 선언 이후 값을 바꿀 수 없음 read-only라는..

Manifest의 주요 속성 manifest : 안드로이드 앱의 패키지명, 버전정보 등을 정의하는 속성 안드로이브 앱의 패키지명 액티비티의 개수, 앱의 첫 화면을 담당할 액티비티가 무엇인지, 권한(카메라, 파일 접근 등) 허용 등의 코드가 들어있다. 단 하나의 요소를 포함해야 하며 네임스페이스를 지정하는 xmlns:android, package 속성을 지정하게 됨 application : 어플리케이션의 제목과 아이콘을 지정하는 속성 애플리케이션의 구성요소에 영향을 줄 수 있는 하위 요소들 포함한다. activity : 4대 컴포넌트 중 activity를 정의 하는 속성 애플리케이션의 모든 activity는 이 태그를 사용하여 manifest에 지정되어야 하며, 지정되지 않는 activity의 경우 표시하..