아이프렌즈펫 월드컵 응원 사진들

작성자: -











댓글

댓글 쓰기

주간 인기글

[앱 디자인] 디자인 가이드 만들기 - 아이폰

작성자: -
이미지
*아이프렌즈펫 앱 디자인 가이드 경험을 공유합니다. 이게 처음 작업한 앱 디자인 가이드라서 미흡한 점이 많을 수도 있는데 문제가 있는 부분이 있다면 댓글로 알려주시면 반영하겠습니다 ^^ *아이폰 앱 가이드 작업의 특징 디자인 가이드 작업은 기준 해상도 하나를 정해서 그 수치값으로, 이미지 작업은 고객/개발자와 협의한 모든 해상도를 지원하는 방향으로 작업하면 됩니다. 아이폰 해상도를 먼저 보면 이미지 출처: http://protosketch.io/exporting-assets-for-ios-ipads-and-iphones/ 위에 point 가 실제 폰에서의 크기라면 render at 사이즈는 디자이너가 포토샵에서 작업해야 할 픽셀 단위 사이즈라고 보시면 됩니다. 아이프렌즈펫은 일단 기준 해상도를 iPhone6 으로 잡고 가기로 했습니다. 그래서 포토샵에서 작업할때는 750 x 1334 사이즈로 작업해서 해당 작업물로 좌표값, 크기 등을 계산해서 개발자님께 넘겼구요 만약 iPhone5 를 기준 해상도로 잡았다면 640 x 1136 을 기준으로 포토샵 화면 작업을 해서 넘기시면 됩니다. 그러면 개발자는 디자이너가 계산해 넘긴 수치값의 1/2 을 곱하거나 1.5 배 하는 등 계산을 해서 작업을 하게 됩니다. XCode 에서의 작업 화면 만약 750 기준으로 작업을 해서 드리면 1/2 값을 저기에 입력하는 식으로 작업합니다 여기서 알 수 있는 사실은, 포토샵에서 드리는 수치가 최종값이 아니기 때문에 가급적 모든 수치가 짝수가 되고 , 맞아 떨어지는게 좋습니다. 그래야 개발자가 나누고 곱해도 소수점이 나오지 않기 때문이죠. 그래서 아이프렌즈펫 작업을 할때는 한 이미지로 여러 해상도를 지원해야 하기 때문에 가급적 6의 배수 로 크기를 계산한 작업물을 드렸습니다. *좌표 절대적인 건 아니고.. 대략 저런 기준으로 잡아서 작업하시면 됩니다 ^^ 아이폰은 절대 좌표 로 작업합니다. 그러니까 상단 Status ...
자세한 내용 보기

Java8 Stream 가이드

작성자: -
Java8 Stream 가이드 1. 개요 Java 8의 새로운 기능 Stream에 대해 설명합니다. 2. Stream API Java 8의 주요 새로운 기능 중 하나는 여러가지 요소(element) 처리를 위한 매우 강력한 스트림 기능인 java.util.stream 입니다 . 클래스는 Stream 이며, T 타입 기반의 Stream을 다양한 방법으로 생성할 수 있습니다. 2.1. Stream 생성 stream () 및 of () 메소드를 사용하여 콜렉션 또는 배열과 같은 다른 요소 소스에서 스트림을 작성 String [ ] arr = new String [ ] { "a" , "b" , "c" } ; Stream < String > stream = Arrays . stream ( arr ) ; stream = Stream . of ( "a" , "b" , "c" ) ; stream 을 생성하는 쉬운 방법은 컬렉션 인터페이스를 통해 생성할 수 있습니다. Stream < String > stream = list . stream ( ) ; 2.2. 멀티쓰레딩 Streams stream API는 또한 스트림 요소에서 병렬 모드로 작업을 실행 하는 parallelStream() 메서드를 제공하여 멀티 스레딩을 단순화 합니다. 아래 코드 는 스트림의 모든 요소에 대해 doWork () 메소드 를 병렬 로 실행할 수 있도록 합니다 list . parallelStream ( ) . forEach ( element - > doWork ( element ) ) ; 3. Stream 사용법 스트림에서 제공하는 함수는 크게 중간 작업 (return Stream, self-return )과 연산작업 (특정 타입으로 return ) 으로 나뉩니다. long count = list . ...
자세한 내용 보기

Docker 환경에서 ELK + MySQL 연동하기 #1 ELK + MySQL 설치

작성자: -
이미지
안녕하세요. 남산돈가스입니다. 지난 포스팅까지 Docker의 기본 사용법에 대해서 알아보았습니다. 이번에는, 2번의 포스팅으로 나누어 Docker 환경 위에서 ELK스택을 구성하는 법에 대해서 소개 해드릴까 합니다. 회차 별로 소개할 내용은 다음과 같습니다. #1. ELK + MySQL 설치 #2. ELK + MySQL 연동 그 중 첫 번째 시간으로, ELK스택 환경과 연동을 위한 MySQL을 설치해보겠습니다. Docker 환경 위에서 설치하기 때문에, Docker에 대한 기본 사용법은 숙지하고 계셔야합니다. Docker(도커) 기본 사용법  을 참고하시면 될 것 같습니다. 자, 그럼 일단 환경설치를 위해서는 Docker 이미지를 설치해야합니다. 필요한 Docker 이미지는 ELK의 Elasticsearch, Logstash, Kibana 그리고 MySQL까지 총 4개입니다. pull 명령어를 이용하여 해당하는 이미지를 다운받습니다. * Elasticsearch gimseongsin@gimseongsin - ui - MacBook - Pro :~/ Desktop / es / data :> docker pull elasticsearch Using default tag : latest latest : Pulling from library / elasticsearch 0bd44ff9c2cf : Pull complete 047670ddbd2a : Pull complete ea7d5dc89438 : Pull complete 4a05570971bb : Pull complete 66f679cd5859 : Pull complete 89362eaac850 : Pull complete d76c23323cb4 : Pull complete f7a113d2d566 : Pull complete aba04b0b43a6 : Pull complete 9a29cd...
자세한 내용 보기

[HTML] SVG 아이콘 만들기

작성자: -
이미지
안녕하세요. 명동섞어찌개입니다. SVG (Scalable Vector Graphics) 는 이름 그대로 Bitmap 이미지와 달리 확대, 축소해도 깨지지 않는 이미지 포맷이죠. 요새 아이콘을 화면에 넣을 때 많이 쓰는 방법으로 아이콘 폰트를 임베딩해서 쓰거나, svg 아이콘을 다운받아 쓰는 법 외에 SVG 아이콘을 그려서 화면에 적용하는 아주 간단한 팁을 알려드릴께요! 1. Adobe 일러스트레이터를 켭니다. 없으신 분은.. 디자이너분께 부탁드려보시거나 회사 라이센스 프로그램이 있을 경우 그걸 써보세요 (협업~) 2. 일러스트레이터에서 필요한 아이콘을 그립니다. 굳이 코딩으로 어렵게 계산해서 그리실 필요가 전혀 없습니다. 그냥 보면서 그립니다. 3. 아이콘을 선택한 후 복사합니다. (Ctrl + C) 4. 새 문서를 만든 뒤 붙여넣기 합니다. (Ctrl + V) [ icon-add-user-on.svg] 끝. 참 쉽죠?! 5. 마지막으로 CSS 에 적용합니다. 저 같은 경우는 일반적으로 이런 식으로 사용합니다. [layout.css] 1 2 3 . customIcon : before { content: '' ; position: absolute ; top: 12 px ; left: 3 px ; background - size: 20 px auto ; background - repeat: no - repeat ; width: 20 px ; height: 20 px ;} . addUser { background - image: url ( assets / icons / icon - add - user - on . svg );} [html] 1 < i class = "customIcon addUser" ></ i >
자세한 내용 보기

네이버클라우드 SENS를 이용하여 SMS 발송서비스 만들기 #1

작성자: -
이미지
안녕하세요? 남산돈가스입니다. 팀 프로젝트를 진행하던 중 SMS 발송서비스를 구현해야하는 케이스가 생겨서 문자 발송서비스를 알아보던 중 네이버클라우드에서 제공하는 SENS (Simple & Easy Notification Services)를 알게되었습니다. SENS는 OPEN API로도 제공되고 있어 서비스를 구현하는데 편리하게 이용할 수 있을 것 같아 한번 사용해보았습니다. 그래서 오늘은 이 SENS를 이용하여 문자발송 서비스 구현하는 법을 소개해볼까 합니다. 이번 포스팅은 두번에 걸쳐 진행될 것이며, 내용은 다음과 같습니다.   #1. 프로젝트 등록 후 콘솔 상에서 문자 발송해보기   #2. OPEN API를 이용하여 문자 발송해보기 그렇다면, 첫번 째 시간으로 '프로젝트 등록 후 콘솔 상에서 문자 발송해보기'  포스팅 시작해보겠습니다. 먼저, 네이버클라우드  로 접속하여 서비스 탭을 선택한 뒤 우측 중간에 있는 Simple & Easy Notification Service(SENS)를 클릭합니다. SENS 서비스로 이동하면, 아래와 같이 SENS의 기능 및 요금 정책에 대한 소개 페이지가 오픈됩니다. 제가 포스팅에서 설명하는 기능 외에도 모바일 PUSH 서비스도 제공하니 참고하시면 도움이 될 것입니다. '이용 신청하기'를 선택합니다. '이용 신청하기' 버튼을 누르면, 다음과 같이 SENS 서비스 콘솔화면으로 이동 된 것을 확인하실 수 있습니다. 실제 SENS 프로젝트를 생성하고 테스트 해볼 수 있는 페이지는 지금 보이는 콘솔 화면입니다. '프로젝트 생성하기' 버튼을 선택합니다. '프로젝트 생성하기' 버튼을 선택하면, 다음과 같이 프로젝트 등록 탭이 팝업됩니다. 등록 팝업에서 입력해야하는 정보는 다음과 같이 세가지 입니다. 서비스 - 저희는 SMS서비스를 이용할 것이므로, SMS를 체크합니다. 이름 - 프로...
자세한 내용 보기