김민정

김민정의 프로필 이미지

안녕하세요.
신입 웹퍼블리셔 김민정입니다.

의미를 찾아가는 신입웹퍼블리셔 김민정입니다.
저와 사계절을 함께할 곳을 찾습니다.

Profile

  • 김민정/ 1997.07 (28세)/ 성남시 거주

    김민정의 프로필이미지2

    안녕하세요, 저는 화할 민(旼) 나무바를 정(柾)
    주변 사람들과 원만한 대인관계를 맺고 정직하며 성실한 김민정입니다. 나무같이 차분하고 침착한 성격을 강점으로, 꼼꼼하고 주도적인 업무태도를 가졌습니다. 전문적인 지식에 욕심이 생겨 웹 퍼블리셔 준비를 시작했고, 키보드를 두드리는 감각, 그리고 금새 화려한 웹페이지가 펼쳐지는 코딩의 매력에 빠져버렸습니다. 항상 열려있는 자세로 배움의 준비가 되어있습니다. 다양한 웹 사이트를 구축하며 잡학다식한 웹퍼블리셔가 되는 것이 목표입니다.

    웹페이지 소개 포트폴리오 회고록
  • Education

    강의
    • 모란 이젠 IT아카데미 UX/UI 웹디자인 with 유튜브동영상 반응형 웹 2023.11.01 ~ 2024.03.20
    • 하이미이어탱크 포토샵&일러스트(GTQ+GTQi) 그래픽디자인 2023.02.15 ~ 2023.03.17
    • 모란 이젠 IT아카데미 학습 과정 보기

    하이미디어탱크
    모란이젠아카데미

  • Experience&Hobby

    아르바이트
    • #카페 아르바이트 #봉사활동
    • #등산 #운동
    • #낙천적인 #습득력이 빠른

SKILL&TOOL

4개월간 학습한 과목입니다.

  • HTML

    HTML 문서의 구조와 요소에 대한 속성(attribute)을 이해하고 시맨틱(의미적인) 요소를 적절하게 사용할 수 있습니다.

  • CSS

    CSS 선택자(selector)를 이해하고 요소를 선택하여 스타일을 적용하고 레이아웃을 조정하고 박스의 크기와 간격을 조정할 수 있습니다.

  • Javascript

    제이쿼리를 이해하고 다양한 방법으로 제이쿼리파일을 웹문서에 연결하여 제이쿼리 기본구조를 작성하여 스크립트를 시작합니다.

  • jquery

    요소에 이벤트 핸들러를 추가하고, 클릭, 변경 등 다양한 이벤트를 연결하고 하수필터 선택자를 사용하여 선택자를 탐색할 수 있습니다.

  • photoshop

    레이어 기능을 통해 여러 이미지를 결합하거나 특정 부분을 겹쳐 표현하는 등의 작업, 웹 페이지에 사용할 이미지를 최적화, 이미지를 다양한 파일 형식으로 내보내는 기능을 활용하여 웹 페이지에서 필요한 형식에 맞게 이미지를 편집할 수 있습니다.

  • illustrator

    로고, 아이콘, 버튼, 일러스트레이션 등의 그래픽 요소를 제작 또는 수정하고 웹 페이지에서 사용할 텍스트 요소를 스타일링할 수 있습니다.

  • google drive

    구글 드라이브의 모바일 앱을 통해 언제 어디서나 파일에 접근하고 편집할 수 있는 편리함이 장점이 있어, 이를 통해 작업에 필요한 문서, 이미지 등을 업로드 또는 다운로드 받으며 작업 현황과 일지를 기록해 파일 관리 및 협업에 이용합니다.

  • github

    프로젝트를 배포하고 호스팅, 또 이력을 관리하고 다른 팀원과 협업하기 용이한 깃허브를 활용하여 프로젝트를 공유하고, 프로젝트 설명을 위한 리드미를 작성합니다.

Work process

시멘틱 마크업과 UI/UX를 중점으로 잡업한 과정을 설명합니다.

  • 01

    벤치마킹 사이트 분석

    웹사이트 '지디웹'을 통해 디자인클론코딩 할 사이트를 선정합니다.

  • 02

    기초데이터 수집

    필요한 이미지 등을 디지털 디자인 소프트웨어를 활용하여 편집하고, 화면 구성 요소, 아이콘, 서체를 수집합니다.

  • 03

    디자인 컨셉 도출

    전반적인 레이아웃 설계와 서비스, 제작물의 통합적인 아이덴티티를 고려하여 디자인 가이드를 조합합니다.

  • 04

    아이디어스케치

    구글시트, 카카오오븐을 활용하여 와이어프레임, 스토리보드, 초안, 시안작업을 통해 디자인 스타일, 컬러, 서체 등을 구체화합니다.

  • 05

    트렌드와 경쟁사 홈페이지 분석

    트렌드 분석을 통해 전략적인 콘셉트를 확보합니다. 또한 프로젝트 관련 디자인 개발에 필요한 요소를 파악하고 인터페이스(interface) 필요 요소와 항목들을 분석하기 위해 경쟁 홈페이지들의 장단점을 조사 분석합니다.

  • 06

    웹 퍼블리싱

    Visual Code 프로그램과 HTML5, CSS, SASS, JavaScript, JQuery를 이용하여 웹 페이지를 구축하고 사용자 경험을 향상시킬 수 있는 동적인 표현을 추가합니다.

  • 07

    수정 및 보완

    초기 로딩 속도와 검색 엔진 최적화를 위한 요소 등 웹사이트의 성능과 품질을 다시 한번 확인합니다.

Responsive

PC에 최적화된 웹사이트를
핸드폰과 태블릿에서도 사용할 수 있도록 반응형 웹사이트를 제작하였습니다.

CONTACT

저의 포트폴리오를 방문해주셔서 진심으로 감사드립니다.
제가 더 궁금하시다면 아래 링크를 참고하시고, 편하게 연락주시길바랍니다.

김민정의 프로필사진