[데이터 시각화의 기초] 그냥 차트 만들면 되는거 아니야?
·
Visualization
우리 주변에서 매일 엄청난 양의 데이터가 쏟아져 나오고 있습니다. 가동되지 않은 데이터는 그저 디지털 쪼가리에 불과하지만, 제대로 분석하고 활용해 인사이트를 얻을 수 있죠. 데이터 시각화는 데이터로부터 인사이트를 뽑아주는 강력한 도구죠! 보고서를 만들 때, 대학교 PT과제를 할 때 등, 이미 디자이너뿐만 아니라 많은 분들이 데이터를 시각화해 본 경험이 있을 겁니다. 하지만 생각보다 데이터의 형식은 다양하고, 시각화 방법도 훨씬 다양합니다.  우선 데이터 시각화의 목적과 필요성을 알아보고, 다음 블로그에 이어서 다양한 데이터 종류와 효과적인 시각화 방법에 대해 알아보려 합니다. 데이터 시각화의 목적과 필요성데이터 시각화는 데이터로부터 인사이트를 뽑아내기 위해 활용합니다.(1)데이터가 의미하는 바를 직관적으..
[넓고 얕은 IT 지식] 개발자가 아니어도, IT기술은 알아야죠!
·
IT (Technology)
요즘 생각할 시간이 많아져서, 제가 어떤 생각으로 IT에서 일을 시작했는지 다시 돌아봤습니다.어릴때부터 컴퓨터, 스마트폰, 그리고 최근에는 AI 등 고도화된 기술이 우리 삶에 들어오면서 생활이 점차 변화해 왔습니다.이 변화를 직접 만들어내고 싶다는 마음, 미래를 설계하는 사람으로 성장하고 싶다는 것이 제 꿈의 시작이었던 것 같습니다. (바쁘게 살다 보니 보니 초심을 잠시 잊고 살았던 것 같네요ㅜㅜ) 기술을 넓게 이해하는 이유미래를 설계하려면 다양한 기술에 대해 폭넓게 이해하는 것이 중요합니다. 기술의 본질을 알고 나면, 이를 바탕으로 어떻게 적용하고 활용할 수 있을지 방향을 설정할 수 있기 때문이죠.“충분히 발달한 과학 기술은 마법과 구분할 수 없다.”- 아서 C. 클라크 이 말은 제가 정말 좋아하는 문..
화폐의 가치 - 미래가치와 현재가치 알아보기
·
Finance
화폐는 시간에 따라 가치가 달라지게 됩니다. 이렇게 들으면 어렵겠지만, 옛날에 500원이던 마이쮸가 지금은 1200원인걸 생각해 보면 우리 삶과 그렇게 동떨어진 개념은 아닙니다. 미래가치와 현재가치에 대해 알아보도록 하겠습니다. 미래가치 (FV, Future Value) : 현재 화폐를 미래의 가치로 표현하는 것 FV = PV X ( 1 + 할인율 )^기간 우리가 투자를 해야하는 이유를 미래가치로 부터 찾을 수 있습니다. 현재의 1억을 현금으로만 가지고 있게 된다면 인플레이션으로 인해 화폐의 가치는 점점 올라가게 되지만, 제가 가지고 있는 현금은 5년 뒤에도 1억 원 그대로겠죠. 인플레이션율을 2%라고 가정하고 5년뒤 1억 원의 미래가치는, FV = 100,000,000 X ( 1 + 0.02 )^5 =..
이자 계산 - 단리와 복리 차이 알아보기
·
Finance
투자시 이자를 산출하는 방법에는 단리, 복리 2가지가 있습니다. 단리 vs 복리 단리는 원금에 대해서만 이자를 계산합니다. 반면 복리는 이자를 포함해 계산합니다. 이 차이 때문에 시간이 지날수록 단리와 복리의 차이는 점점 벌어지게 됩니다. 즉 동일한 수익률인 경우에는 복리가 더 이득입니다. 단리 : 원금에 대해 이자를 계산 원리금 = 원금 X (1 + (금리 X 납입 연수)) 30,000,000원을 4%의 수익률로 3년간 단리로 저축하는 적금 상품에 가입한 경우, 원리금 = 30,000,000 X (1 + (0.04 X 3)) = 33,600,000 3년뒤에는 33,600,000원이 됩니다. 이자는. 3,600,000원을 받게 됩니다. 복리 : 원금에 이자를 포함해 계산 원리금 = 원금 X (1 + 금리..
[Framer X Code] Framer에서 쓸 수 있는 NPM 패키지
·
Framer
프로토타입을 React에서 Framer로 옮기니, 패키지를 못쓰는 게 제일 쉽지 않았어요 ㅎㅎ... 불꽃 검색 중 우연히 찾은 링크를 공유드립니다! 1. Framer에서 NPM 사용하기 보통 리액트에서는 터미널로 패키지를 설치하는데, Framer는 불가능합니다. 다행히도 Framer에서 쓸 수 있는 NPM 패키지가 몇 개 있더라고요! (앞에 올린 chart Component도 여기에 원래 Example이 있습니다.) 링크에 들어가면 example을 확인해볼 수 있습니다. 링크 : https://www.framer.com/npm/ Framer: Instant NPM Beta Endless possibilities with instant NPM support. www.framer.com 2. NPM 리스트 ..
[UX와 AI 사이] ChatGPT, 고도화된 챗봇(이라고 쓰고 새로운 검색 경험이라 읽는다)
·
UX
chatGPT가 뭐야? ChatGPT는 OpenAI가 개발한 GPT-3.5 기반의 대형 언어 모델(large language model, LLM) 챗봇 ChatGPT는 대화 형태로 상호작용을 하며 놀라울 정도로 인간과 대화하는 것과 같은 반응을 제공하는 능력을 가지고 있습니다. 대형 언어 모델 (large language model, LLM)은 일련의 단어에서 다음 단어를 예측하는 작업을 수행합니다. chatGPT, 폭발적인 인기의 비결은! 이렇게 chatGPT에 열광하는 이유는 사람들이 chatGPT를 통해 엄청난 경험을 했기 때문입니다. 다르게 말하면, 특정한 문제를 기똥차게 해결했기 때문이고, 그 문제는 “검색(Searching)“인 것 같습니다. 사실 사람들은 "검색"에 불편함을 느끼고 있었던 것..
[Framer X Code] chart.js로 차트 컴포넌트 만들기
·
Framer
차트를 하나하나 디자인할 수 있겠지만, 귀찮을 때!!! 그냥 chart.js로 그래프를 넣어버리자!!! 0. 코드 파일 생성하기 오늘 만들 친구는 코드 컴포넌트입니다. Code component 파일을 만들어줍니다. 저는 파일 이름을 Chart라고 지었습니다. 그리고 오늘 저는 도넛 차트를 그릴 겁니다! 1. chart.js 사용 세팅 chart.js를 사용하기 위해서는 아래의 것들을 import 해야 합니다. import { Chart as ChartJS, LinearScale, ArcElement, CategoryScale, PointElement, LineElement, Tooltip, Legend, } from "chart.js" ChartJS.register( ArcElement, Tooltip..
[AI X Design] 마이크로소프트 디자이너 - AI 디자인 툴
·
Design
The wait is over! You're in! 드디어 마이크로소프트 디자이너를 써볼 수 있게 되었습니다. 이에 리뷰를 한번... 시작해 보지요. 0. Intro? 좌측에는 prompt가 있고, 우측에는 이미지와 prompt 예시를 보여줍니다. 예시들은... 전형적인 PPT 디자인 같은 느낌을 많이 받았습니다. Pinterest에 PPT Design이라고 검색하면 나올 것 같은 이미지들이기도 하고... 어려운 디자인이 아니라서, 굳이 AI로 써야 하나? 하는 생각이 제일 먼저 들었던 것 같습니다. (물론 제가 Designer의 기능을 아직 모르는 상태였기 때문에 그렇기도 합니다. 그리고 AI로 저런 구성을 만들어 내는 것이 쉽지는 않다는 점은 알고 있습니다.) 1. Templete Try a prom..