TOTAL

[React] Youtube.js

1. 유튜브 페이지 import React from "react"; import Header from "../Header"; import Footer from "../Footer"; function About() { return ( Reference Site 웹 표준 사이트 만들기 레이아웃 레이아웃은 사이트를 만드는데 가장 기본적이 요소입니다. 레이아웃만 제대로 만들 수 있다면 사이트의 제작에 50%는 끝나다고 보셔도 됩니다. 그만큼 레이아웃 제작은 상당히 중요합니다. 플러그인 제이쿼리를 통하여 이미지슬라이..

React.js 2021.02.19 0
[React] Reference.js

1. 레퍼런스 페이지 import React from "react"; import Header from "../Header"; import Footer from "../Footer"; function Reference() { return ( Reference Site HTML CSS JAVASCRIPT JQUERY A align-content align-content 속성은 콘텐츠의 상하관계 정렬 상태를 정의합니다. align-items align-items 속성은 콘텐츠 내부의 정렬 상태를 정의합니다. all all 속성은 요소의 속성을 초기화 또는 상속을 설정합니다. animat..

React.js 2021.02.19 0
[React] About.js

1. 어바웃 페이지 import React from "react"; import Header from "../Header"; import Footer from "../Footer"; function About() { return ( About Me 꿈을 설계하고 디자인 하다. 나는 공간을 만드는 것을 좋아한다. 어려을 때부터 나만의 공간을 만드는 것을 좋아했고 나만의 다락방을 좋아했다. 단 한 사람이라도 내가 만든 공간 속에서 영감을 받거나 마음이 움직였으면 좋겠다. 서울에는 집이 없지만, 이곳에서는 나만..

React.js 2021.02.19 0
[React] Router

1. Router 리액트는 싱글 페이지로 구성되어 있기 때문에 가상의 주소를 만들어 주어야 합니다. 라우터를 이용하여 URL을 통해 특정 컴퍼넌트를 불러와서 사이트를 구성할 것입니다. 우선 react-router-dom 패키지를 설치합니다. npm install react-router-dom yarn add react-router-dom 1.1 Router 설정 import React from 'react' import Header from './components/Header' import Main from './components/pages/Main' impo..

React.js 2021.02.06 0

UI/UX

more
UI/UX 가이드 제작

UI/UX 가이드 공유하기 UI/UX 가이드 관리 및 운용 선정된 가이드 공유 대상자에게 문서 보안 규정을 준수할 수 있는 최적화된 공유 방법을 결정하여 배포할 수 있다. 보안 목표 명세서 평가를 신청하려는 정보 보호 시스템에 해당하는 보호 프로파일(PP)의 보안 요구 사항을 기초로 시스템 사용환경, 보안환경, 보안요구사항, 보안 기능 명세등을 서술한 문서를 의미한다. 전자화 문서 종이 문서나 그 밖에 전자적 형태로 작성..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 공유하기 UI/UX 가이드 공유 선정된 가이드 공유 대상자에게 문서 보안 규정을 준수할 수 있는 최적화된 공유 방법을 결정하여 배포할 수 있다. 보안 목표 명세서 평가를 신청하려는 정보 보호 시스템에 해당하는 보호 프로파일(PP)의 보안 요구 사항을 기초로 시스템 사용환경, 보안환경, 보안요구사항, 보안기능 명세등을 서술한 문서를 의미한다. 전자화 문서 종이 문서나 그 밖에 전자적 형태로 작성되지 않은..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 공유하기 UI/UX 가이드 필요 대상 선정 UI/UX 가이드가 필요한 대상을 문서 보안 규정에 따라서 선정할 수 있다. 보안 규정 기업에서 비즈니스 활동을 수행하는 과정에서 생산되는 모든 문서에 대해서, 문서별로 보안 등급을 설정하고, 개인별로는 보안 문서를 열람할 수 있는 등급 권한을 부여하다. 이를 통해, 해당 권한을 확보한 자에한정하여 문서를 열람할 수 있게 하여 보안을 강화하는 것이다. 그 러므로..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 작성하기 UI/UX 가이드 작성 결정된 종류, 형식, 목차에 따라서 UI/UX 가이드를 작성할 수 있다. 컨셉모델 컨셉모델은 여러 가지 추상적인 컨셉들 사이의 관계를 보여주는 다이어그램이며, 다양한 아 이디어들을 간편하게 시각화하여 표현할 수 있는 유용한 방법으로, 아이디어를 잘 전달하는 것 뿐만 아니라 생각의 과정을 효율적으로 이끌어준다. 또한 문서의 작성자에게 뿐만 아니라, 문서를 활용하는 사람들에..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 작성하기 UI/UX 가이드 목차 작성 도출된 가이드 기준에 따라서 가이드의 목차를 결정할 수 있다. 사용자 중심 디자인 사용자 중심 디자인 (User Centered Design, UCD)는 사용자가 원하고 필요로 하는 것에 대해 사용자의 한계 능력과 상황에 맞추어 디자인 프로세스를 통해 사용자를 중심으로 사고하여 만들어 내는 인터페이스, 서비스, 제품 디자인의 철학적 접근 방법이자 디자인 사상이다. 디 자인의 각 단계..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 작성하기 가이드 문서의 종류와 형식 결정 가이드에 대한 문서의 종류와 형식을 결정할 수 있다. UI/UX 가이드 SW개발에 필요한 UI/UX 전략 및 설계 내역을 상세하게 작성한 문서이다. SW개발 및 관계자 가 필요에 의해서 누구라도 접근해서 즉시 활용할 수 있어야 하므로, 이해하고 쉽게 기술을 해야 한다. 또한, UI/UX 전략 및 설계 내역에 대해서 누락 없이 충분히 객관적으로 기술되어 야 한다. GUI 가이드문..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 기준 도출하기 UI/UX 가이드 요소별 항목 정의 요소별 항목에 따라서 UI/UX 가이드에 기술할 내역을 결정할 수 있다. 와이어프레임 최종적으로 화면에 표시될 컨텐츠를 간단하게 요약하여 보여주는 것으로서 색상, 타이포그래피, 이미지 등을 생략하는 경우가 많다. 도식, 청사진, 또는 프로토타입이라고 부르기도 한다. 태스크플로우 사용자들이 UI 혹은 웹사이트 등을 실행하는데 있어 하나의 목적을 달성해 나..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 기준 도출하기 UI/UX 산출물의 분류 가이드 구성 기준에 따라서 요소별 항목을 분류할 수 있다. UI/UX 가이드 요소별 항목 UI/UX 가이드 요소별 항목이란 UI/UX 가이드를 구성하는 콘텐츠의 구체적인 내용과 상세한 영역을 지칭한다. 예를 들면, UI/UX 콘셉트가 UI/UX 가이드 요소별 항목이며, VRIN(Valuable, Rare, Inimitable, Nonsubstitutable) 전략, 페르소나별 시나리오 등이 구체적인 내용과 상세한 영역이..

UI.UX 가이드 제작 2018.11.29 0
UI/UX 가이드 제작

UI/UX 가이드 기준 도출하기 UI/UX 가이드 구성 기준 수립 UI/UX 산출물을 검토하여 가이드 구성 기준을 수립할 수 있다. UI/UX 산출물 UI/UX 산출물은 전체 UI/UX 업무를 수행하는 과정에서 생성되는 산출물 중에서 SW 개발에 직접적으로 필요한, UI/UX 콘셉트, 콘텐츠, 정보 구조, 워크플로우, 서비스 정책, 디자인 산출 물 등을 지칭한다. UI/UX 가이드 구성 기준 UI/UX 가이드 구성 기준이란 전체 UI/UX 산출물 중에서 SW..

UI.UX 가이드 제작 2018.11.29 0
UI 테스트

테스트 결과 보고하기 UI 개선 결과보고서 공유 UI 개선 방안과 수립된 수정 계획을 바탕으로 결과 보고서를 작성하여 관련 부서 공유할 수 있다. 사용자 중심 매뉴얼 일반적을 소프트웨어를 개발 할 때, 사용자 매뉴얼이 제작되어 제공되기는 하지만, 개발의 가장 마지막 단계에서 단기간에 작성되는 현실상의 문제 등으로 기능 설명 위주의 개발자 관점으로 작성이 되는 것이 일반적이다. 이렇게 작성된 매뉴얼은 이해도와 활..

UI 테스트 2018.11.29 0
디바이스 최적화하기

앱 등록하기 앱 등록 수행 개발된 앱을 선정된 앱 등록사이트나 마켓의 절차에 따라 등록할 수 있다. 앱 배포 과정 앱 배포(publishing)란 개발된 앱을 사용자가 사용할 수 있게 하는 과정을 말한다. 운영체 제 환경별로 각각 배포 과정이 다르며 주의과정도 다르다. 안드로이드 앱 배포 과정 앱의 릴리즈 버전 빌드 앱을 릴리즈 버전으로 구성하기 앱 릴리즈 버전을 생성하고 서명하기 앱 릴리스 버전 테스트하기/li> 앱 리소..

디바이스 최적화하기

앱 등록하기 앱 등록 관련 법규 파악 조사된 앱 등록사이트나 마켓의 특성에 따라 앱 등록에 필요한 관련 법규를 준수할 수 있다. 개인정보보호 스마트폰, 태블릿 PC 등 스마트 기기의 보급에 따른 대중화와 함께 특정한 기능을 수행하 는 앱(App)의 이용이 증가함에 따라 이를 통한 개인정보 유출 및 노출 위험성이 점차 높 아지고 있다. 때문에 앱을 통한 개인정보 유.노출 등의 피해를 최소화하기 위한 조치가 앱 개발 단계..

디바이스 최적화하기

앱 등록하기 앱 등록을 위한 시장 분석 개발된 앱의 런칭에 적합한 앱 등록 사이트나 마켓의 특성을 조사할 수 있다. 앱 마켓 시장현황 앱 마켓은 앱 스토어라고도 불리며 스마트폰과 같은 스마트 기기에서 사용하는 앱(애플리 케이션)이나 모바일 콘텐츠를 온라인상에서 무료 또는 유료로 판매하는 곳을 의미한다. 앱 마켓은 모바일 스마트기기의 대중화로 폭발적으로 성장하고 있다. 특히 최근에는 모바일 앱 개발사 및 퍼블..

디바이스 최적화하기

디버깅/테스트하기 고객 참여 테스트 수행 및 검증 인수테스트 계획대로 고객의 입회하에 테스트를 수행하고 검증할 수 있다. 인수 테스트 개발된 소프트웨어가 고객의 요구사항을 만족하는지 조사하는 시험을 확인 테스트 (validation testing)라고 한다. 확인 테스트는 개발자, 독립적인 테스트(ITG, Independent Testing Group) 및 사용자가 수행한다. 사용자가 수행하는 확인 테스트를 인수 테스트 (acceptance testing)라..

디바이스 최적화하기

디버깅/테스트하기 시스템 운영 환경 기반 테스트 수행 및 검증 시스템 테스트 계획대로 시스템 운영과 근접한 환경에서 테스트를 수행하고 검증할 수 있다. 시스템 테스트 소프트웨어는 컴퓨터를 기반으로 하는 시스템 중의 한 요소일 뿐이다. 따라서 소프트웨어 와 다른 시스템 요소(예를 들어 하드웨어, 정보 및 다른 소프트웨어 등)들과 통합하여야 하며 모든 요소들이 적절히 조화를 이루어 시스템의 기능을 만족하는지 확..

디바이스 최적화하기

디버깅/테스트하기 통합 모듈 및 UI별 테스트 수행 및 검증 통합 테스트 계획대로 통합 모듈 및 인터페이스별로 테스트를 수행하고 검증할 수 있다. 통합 테스트 단위 테스트를 충분히 수행한다 하여도 모든 설계 오류를 발견할 수는 없다. 여러 모듈이 통합되어 완전한 프로그램을 구성하며 모듈 간에 영향을 미친다. 모듈 각각이 완전하게 보여도 이들 모듈을 통합하면 서로 불일치하여 발생하는 오류, 전역변수에 대한 부정..

디바이스 최적화하기

디버깅/테스트하기 단위별 테스트 수행 및 검증 단위 테스트 계획대로 단위 모듈/컴포넌트 별로 테스트를 수행하고 검증할 수 있다. 단위 테스트 단위 테스트(unit test)는 프로그램의 기본 단위인 모듈에 대한 테스트를 의미한다. 상세 설 계에서의 모듈에 대한 설계 지침을 기반으로 모듈의 중요한 경로와 경계값을 테스트해야 한다. V모델 방식의 소프트웨어 개발에서 단위 테스트는 테스트 프로세스의 첫 단계이다. 단위 테..

디바이스 최적화하기

디버깅/테스트하기 테스트 레벨별 계획 수립 고객의 요구사항을 반영하여 개발된 앱을 테스트 레벨별(단위/통합/시스템/인수 테스 트)로 검증할 수 있도록 테스트 계획을 수립할 수 있다. 소프트웨어 테스트 V모델 V모델은 Water-fall의 확장형으로, Water-fall 모델의 개발 각 단계를 각각 대칭되는 4가 지 단계의 테스팅 모델로 정의하여 테스트 절차를 강화한 개발 모델이다. V모델은 개발 및 테스트 단계를 기준으로 개발..

디바이스 최적화하기

테스트 계획 수립하기 UX 테스트 수행 각 앱의 목적성과 사용자 경험을 중심으로 테스트를 진행할 수 있다. UI/UX 사용성 테스트 프로젝트를 진행하고 나서 산출물이 잘 개발되었는지 테스트할 때 어떤 기준으로 도출된 산출물이 잘 개발되었는지 그렇지 않은지 판단할 것인가에 대해 고민하게 된다. 특히 제 품이 아닌 무형의 디지털 형태의 요소는 더 더욱 그 기준과 판단 양식에 대해 더욱 고민 하게 된다. 사용성 테스트 프..

디바이스 최적화하기

테스트 계획 수립하기 플랫폼별 테스트 계획 수립 플랫폼별 사용자의 경험을 최적화 할 수 있는 테스트 계획을 수립할 수 있다 테스트 케이스 결함을 발견할 목적으로 준비된 입력 데이터와 예상 결과의 집합이 테스트 케이스이다. 성공적인 테스팅을 위하여 무엇보다 중요한 것은 결함의 존재를 잘 드러내는 좋은 테스트 케이스를 찾아내는 것이다. 그 이유는 프로그램에 결함이 있더라도 입력에 대하여 여전히 정상적인 결과..