To infinity
-
[UI Clone for iOS] 배경에 따라 바의 색이 변하도록 만들기 | blur 효과To infinity/UI,UX 2022. 2. 28. 13:11
1. 배경그림에 따라 '상태바'의 색이 변하도록 설정하기 재사용이 가능하도록 만들어야 하기 때문에 단독으로 색상을 주기 보다는 배경색을 끌고오는 형태로 만드는 것이 좋다. '상태바'라고 칭하는 아래 사각형은 현재 흰색 배경으로 채워져있는 상태다. 1) 해당 흰 배경을 끄고 (fill을 체크를 해제한다) 2) blur에서 background blur로 상태를 바꾼 뒤 어느정도 블러를 줄지 값을 설정한다. 그러면 아래 그림처럼 배경색을 블러처리하여 어떤 배경그림이 와도 상태바에 색상이 들어가게 된다. 2. 해당 설정을 심볼로 만들어야 할까? 이미 비슷한 모양의 심볼이 존재하고, 단지 '배경색상'만 변하기 때문에 또 하나의 심볼을 만드는 것은 비효율적이다. 따라서, 기존 심볼에서 배경색상만 변하도록 '스타일'..
-
[UI/UX] iOS 클론디자인 / sketch / 카드만들기 유형1 완성!To infinity/UI,UX 2022. 2. 26. 13:23
Sat / Feb.26.2022 Used Tool: Sketch iOS 카드 만들기 유형1을 완료했다. 뭔가 처음 만들어본 디자인 작업물이어서 그런지 뿌듯하다. 디자인 요소 중에 비슷한 항목끼리 묶어서 하나의 요소로 만들어 재사용이 가능하도록 만드는 것이 중요한 것 같다. 그렇게 하면 작업시간도 줄일 수 있지만 심볼의 개수도 줄어들어 용량도 아낄 수 있을 듯 하다. 마치 비슷한 코드끼리는 묶어서 간결하게 만들어 읽기에도 좋고 속도도 높일 수 있도록 코드를 짜는 것과 비슷하단 생각이 들었다. [ 작업물 ] 1. Cards 2. Symbols 위의 심볼들을 이용하여 1번 카드들을 만들었다. get 과 open 버튼 패키지를 만들어서 open이라는 단독 버튼이 꼭 필요한지, 삭제해도 상관 없지 않을까라는 생각..
-
[UI/UX] iOS 클론디자인 / 아이콘 배경색에 따라 테두리 색상을 모두 다르게 적용해야 할 때To infinity/UI,UX 2022. 2. 26. 11:17
아이콘 배경색에 따라 테두리 색상을 모두 다르게 적용해야 한다. 1. 배운점: 동일한 형태를 사용하는 항목은 변수에 의해 달라질 수 있도록 내용을 적용시킨다. 2. - 생각: 나는 아이콘 테두리 색상을 아이콘 배경색상을 추출하여 더 어두운 색상으로 적용했다. - 문제: 아이콘을 담는 틀은 모두 같고, 이미지만 바뀔 뿐이므로 아이콘 배경 색상에 따라 테두리 색상도 바뀌어야 한다. - 해결: 테두리에 투명도를 조절하여 이미지가 바뀔 때 마다 테두리 색상도 함께 바뀌도록 적용한다. 이렇게 설정하면 어떤 이미지를 넣어도 해당 이미지의 배경보다 좀 더 어두운 색상의 테두리라인이 그려진다.
-
[Javascript] Object_프로토타입 1To infinity/Javascript 이론 2021. 7. 8. 11:55
자바스크립트는 프로토타입 기반의 객체지향 프로그래밍 언어이다. 객체지향 프로그래밍? - 객체의 집합으로 프로그램을 표현하려는 패러다임. - 속성을 통해 실체를 인식 - 여러 속성 중 필요한 속성만 추려내는 것 -> 추상화 - 객체: 속성을 통해 여러개의 값을 하나의 단위로 구성한 복합적 자료구조 상태데이터와 동작을 하나의 논리 단위로 묶은 복합적 자료구조 (속성(프로퍼티); 상태를 나타내는 데이터, 정적 / 동작(메서드); 상태 데이터를 조작, 동적) 예를들어, 원의 반지름은 '상태'이고 해당 반지름으로 원의 넓이, 부피, 둘레 등을 구하는 것은 '동작'이다. => 객체는 프로퍼티와 메서드로 이뤄져있다. 상속과 프로토타입 function Circle(radius) { this.radius = radius..
-
[Javascript 이론] Object_함수는 일급객체, 함수 고유의 프로퍼티는?To infinity/Javascript 이론 2021. 7. 8. 10:34
1. 일급객체 다음 조건을 만족한다면, 넌, 일급객체다. 무명의 리터럴로 생성가능. 즉, 런타임에 생성이 가능하다 변수나 자료구조(객체, 배열 등)에 저장할 수 있다. 함수의 매개변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. => 함수형 프로그래밍을 가능케하는 자바스크립트의 장점 자바스크립트의 함수는 위 조건을 모두 충족하므로 일급객체다. 즉, 함수를 객체와 동일하게 사용할 수 있다는 것이다. 객체는 값이므로 함수는 값이다. 함수객체는 일반객체에 없는 함수 고유의 프로퍼티를 소유한다. 프로퍼티 예를 들어보자 __proto__ : Oject.prototype 객체의 프로퍼티 (접근자 프로퍼티) arguments, caller, length, name, prototype: 함수 객체 고유의 프..
-
[Javascript 이론] Object 프로퍼티 열거 시 특징 (for...in문)To infinity/Javascript 이론 2021. 7. 8. 08:59
모든 프로토타입 열거 for..in문은 순회하는 객체의 프로퍼티 뿐만 아니라 상속받은 프로토타입의 프로퍼티까지 열거한다. 즉, 객체의 프로토타입 체인 상에 존재하는 모~든 프로토타입의 프로퍼티 중에서 프로퍼티 어트리뷰트 [[Enumerable]] 값이 true인 항목은 모두 열거한다는 것이다. [참고] 프로퍼티 어트리뷰트 [[Enumerable]] 는 프로퍼티의 열거가능 여부를 나타내며 불리언 값을 갖는다. 좀 쉽게 얘기하자면 나의 프로퍼티뿐만 아니라 내가 속해있는 프로토타입의 프로퍼티를 모두 열거한다는 것이다. 하지만 객체 자신의 프로퍼티인지 확인해야해 만약에 객체 나 자신의 프로퍼티만 열거하고 싶다면 Ojbect.prototype.hasOwnProperty 메서드를 사용해 객체 자신의 프로퍼티인지를 ..