#decre-portfolio-page {
–pf-dark: #111827;
–pf-deep: #151515;
–pf-gray: #4b5563;
–pf-light: #f8fafc;
–pf-line: #e5e7eb;
–pf-gold: #f1c40f;
–pf-blue: #2563eb;
–pf-white: #ffffff;
font-family: ‘Pretendard’, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
max-width: 1180px;
margin: 0 auto;
color: #1f2937;
line-height: 1.75;
word-break: keep-all;
background: #fff;
}
#decre-portfolio-page * {
box-sizing: border-box;
}
#decre-portfolio-page img {
max-width: 100%;
height: auto;
display: block;
}
#decre-portfolio-page a {
color: inherit;
text-decoration: none;
}
.pf-hero {
position: relative;
overflow: hidden;
border-radius: 0 0 46px 46px;
background: linear-gradient(135deg, #111111 0%, #2f343d 55%, #0f172a 100%);
color: #fff;
padding: 82px 36px 74px;
text-align: center;
margin-bottom: 56px;
}
.pf-hero::before {
content: ”;
position: absolute;
width: 360px;
height: 360px;
border-radius: 50%;
background: rgba(241, 196, 15, 0.13);
top: -150px;
right: -130px;
}
.pf-hero::after {
content: ”;
position: absolute;
width: 260px;
height: 260px;
border-radius: 50%;
background: rgba(37, 99, 235, 0.16);
bottom: -130px;
left: -90px;
}
.pf-hero-inner {
position: relative;
z-index: 2;
max-width: 860px;
margin: 0 auto;
}
.pf-eyebrow {
display: inline-flex;
padding: 7px 14px;
border: 1px solid rgba(255,255,255,0.22);
border-radius: 999px;
background: rgba(255,255,255,0.08);
color: #fde68a;
font-size: 0.86rem;
font-weight: 800;
letter-spacing: 0.5px;
margin-bottom: 18px;
}
.pf-visual-title {
margin: 0;
color: #fff;
font-size: clamp(2.3rem, 5vw, 4rem);
font-weight: 900;
letter-spacing: -2px;
line-height: 1.08;
}
.pf-subtitle {
margin-top: 18px;
color: var(–pf-gold);
font-size: clamp(1rem, 2.1vw, 1.35rem);
font-weight: 800;
letter-spacing: 1.4px;
}
.pf-hero-desc {
margin: 22px auto 0;
color: rgba(255,255,255,0.84);
font-size: 1.06rem;
max-width: 760px;
}
.pf-meta {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
margin-top: 28px;
}
.pf-meta span {
padding: 7px 12px;
border-radius: 999px;
background: rgba(255,255,255,0.1);
color: rgba(255,255,255,0.92);
font-size: 0.86rem;
font-weight: 700;
}
.pf-intro {
max-width: 930px;
margin: 0 auto 52px;
padding: 0 20px;
text-align: center;
}
.pf-intro p {
margin: 0 0 16px;
color: #4b5563;
font-size: 1.13rem;
}
.pf-intro strong {
color: #111827;
font-weight: 850;
}
.pf-standard {
max-width: 1060px;
margin: 0 auto 58px;
padding: 0 20px;
}
.pf-standard-inner {
border: 1px solid #dbeafe;
background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
border-radius: 24px;
padding: 28px 30px;
box-shadow: 0 14px 34px rgba(37,99,235,0.06);
}
.pf-standard h2 {
margin: 0 0 12px;
color: #111827;
font-size: 1.55rem;
letter-spacing: -0.5px;
}
.pf-standard p {
margin: 0;
color: #4b5563;
}
.pf-section {
margin-bottom: 72px;
padding: 0 20px;
}
.pf-section-head {
max-width: 1060px;
margin: 0 auto 26px;
}
.pf-section-head .pf-label {
display: inline-flex;
color: #a16207;
background: #fff7d6;
border: 1px solid #f4e7b0;
padding: 5px 10px;
border-radius: 999px;
font-size: 0.78rem;
font-weight: 800;
letter-spacing: 0.3px;
margin-bottom: 10px;
}
.pf-section-head h2 {
margin: 0 0 10px;
color: #111827;
font-size: clamp(1.65rem, 3vw, 2.25rem);
letter-spacing: -0.8px;
}
.pf-section-head p {
margin: 0;
color: #6b7280;
max-width: 850px;
}
.pf-grid {
max-width: 1060px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}
.pf-card {
overflow: hidden;
border-radius: 24px;
border: 1px solid var(–pf-line);
background: #fff;
box-shadow: 0 12px 32px rgba(15,23,42,0.05);
}
.pf-card.dark {
background: #111827;
border-color: #1f2937;
color: #fff;
}
.pf-card.gold {
border-color: #f4e7b0;
background: linear-gradient(135deg, #fffbea 0%, #ffffff 100%);
}
.pf-card-img {
background: #f3f4f6;
border-bottom: 1px solid var(–pf-line);
}
.pf-card.dark .pf-card-img {
border-bottom-color: rgba(255,255,255,0.1);
background: #0f172a;
}
.pf-card-content {
padding: 26px;
}
.pf-tagline {
display: block;
color: #d97706;
font-size: 0.78rem;
font-weight: 900;
letter-spacing: 0.5px;
text-transform: uppercase;
margin-bottom: 9px;
}
.pf-card.dark .pf-tagline {
color: var(–pf-gold);
}
.pf-card h3 {
margin: 0 0 12px;
color: #111827;
font-size: 1.35rem;
letter-spacing: -0.4px;
}
.pf-card.dark h3 {
color: #fff;
}
.pf-card p {
margin: 0 0 16px;
color: #4b5563;
font-size: 0.98rem;
}
.pf-card.dark p {
color: rgba(255,255,255,0.78);
}
.pf-points {
list-style: none;
padding: 0;
margin: 16px 0 0;
}
.pf-points li {
position: relative;
padding-left: 22px;
margin-bottom: 9px;
color: #4b5563;
font-size: 0.94rem;
}
.pf-card.dark .pf-points li {
color: rgba(255,255,255,0.82);
}
.pf-points li::before {
content: ‘✓’;
position: absolute;
left: 0;
top: 0;
color: var(–pf-blue);
font-weight: 900;
}
.pf-card.dark .pf-points li::before {
color: var(–pf-gold);
}
.pf-specs {
display: flex;
flex-wrap: wrap;
gap: 7px;
margin-top: 18px;
}
.pf-specs span {
display: inline-flex;
padding: 5px 10px;
border-radius: 999px;
background: #f3f4f6;
color: #374151;
font-size: 0.76rem;
font-weight: 800;
}
.pf-card.dark .pf-specs span {
background: rgba(255,255,255,0.1);
color: rgba(255,255,255,0.92);
}
.pf-wide {
max-width: 1060px;
margin: 0 auto;
border-radius: 24px;
overflow: hidden;
border: 1px solid var(–pf-line);
background: #fff;
box-shadow: 0 12px 32px rgba(15,23,42,0.05);
}
.pf-wide.dark {
background: #111827;
color: #fff;
border-color: #1f2937;
}
.pf-wide-content {
padding: 28px;
}
.pf-wide-content h3 {
margin: 0 0 12px;
font-size: 1.5rem;
color: #111827;
letter-spacing: -0.5px;
}
.pf-wide.dark .pf-wide-content h3 {
color: #fff;
}
.pf-wide-content p {
margin: 0 0 16px;
color: #4b5563;
}
.pf-wide.dark .pf-wide-content p {
color: rgba(255,255,255,0.78);
}
.pf-image-row {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
margin-top: 20px;
}
.pf-image-box {
overflow: hidden;
border-radius: 18px;
border: 1px solid var(–pf-line);
background: #f8fafc;
}
.pf-image-box figcaption {
padding: 10px 14px;
font-size: 0.86rem;
color: #6b7280;
background: #fff;
}
.pf-card.dark .pf-image-box,
.pf-wide.dark .pf-image-box {
border-color: rgba(255,255,255,0.12);
background: #0f172a;
}
.pf-wide.dark .pf-image-box figcaption {
background: #111827;
color: rgba(255,255,255,0.72);
}
.pf-process {
max-width: 1060px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 14px;
}
.pf-process-item {
background: #f8fafc;
border: 1px solid var(–pf-line);
border-radius: 18px;
padding: 20px;
}
.pf-process-item strong {
display: block;
margin-bottom: 8px;
color: #111827;
font-size: 1rem;
}
.pf-process-item p {
margin: 0;
color: #6b7280;
font-size: 0.92rem;
line-height: 1.6;
}
.pf-link-section {
max-width: 1060px;
margin: 0 auto 58px;
padding: 0 20px;
}
.pf-link-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
.pf-link-card {
display: block;
padding: 22px;
border-radius: 18px;
border: 1px solid var(–pf-line);
background: #fff;
transition: all 0.25s ease;
}
.pf-link-card:hover {
transform: translateY(-5px);
border-color: var(–pf-blue);
box-shadow: 0 16px 36px rgba(37,99,235,0.08);
}
.pf-link-card strong {
display: block;
color: #111827;
font-size: 1.08rem;
margin-bottom: 6px;
}
.pf-link-card span {
display: block;
color: #6b7280;
font-size: 0.92rem;
}
.pf-footer {
text-align: center;
padding: 46px 20px 56px;
border-top: 1px solid #f1f5f9;
color: #6b7280;
}
.pf-footer strong {
display: block;
color: #111827;
font-size: 1.1rem;
margin-bottom: 8px;
}
.pf-updated {
display: inline-flex;
margin-top: 14px;
padding: 6px 12px;
border-radius: 999px;
background: #f3f4f6;
color: #6b7280;
font-size: 0.82rem;
font-weight: 800;
}
@media (max-width: 960px) {
.pf-grid,
.pf-image-row,
.pf-process,
.pf-link-grid {
grid-template-columns: 1fr;
}
.pf-hero {
padding: 62px 24px 58px;
border-radius: 0 0 34px 34px;
}
.pf-standard-inner,
.pf-wide-content,
.pf-card-content {
padding: 24px 20px;
}
}
@media (max-width: 520px) {
#decre-portfolio-page {
line-height: 1.68;
}
.pf-intro p,
.pf-hero-desc {
font-size: 0.98rem;
}
}
Decreyellow Portfolio
디크리노랗 포트폴리오
Design × Engineering × Visualization × CMS
디크리노랗 Decreyellow는 디자인 크리에이터의 시선으로 제품설계, 3D CAD, 시각화, 웹 콘텐츠 운영을 연결합니다. 이 페이지는 노랗노랗의 디자인과 창의력, 상상력을 실무 결과물로 보여주는 포트폴리오 공간입니다.
제품설계
자동차 부품 설계
의료기기 R&D
Adobe·KeyShot 시각화
CMS·SEO 운영
포트폴리오는 단순히 멋진 이미지를 나열하는 공간이 아니라, 어떤 문제를 발견했고 어떤 설계 방식으로 해결했는지를 보여주는 기록이라고 생각합니다.
디크리노랗은 산업디자인, 제품설계, 3D CAD, 렌더링, 영상 편집, 워드프레스 운영 경험을 바탕으로 일상 속 아이디어를 실무 결과물과 콘텐츠로 연결합니다.
3D CAD & Mechanical Engineering
자동차 부품 설계와 기구설계 포트폴리오
UG NX, CATIA, SolidWorks, Rhino 기반의 제품설계 경험을 바탕으로 자동차 부품, 에어덕트, HVAC Duct, 역설계 모델링, 구조 검토 작업을 진행했습니다.
Automotive 3D CAD Modeling
UG NX 기반 자동차 모델링 및 설계 시각화
자동차 외형과 부품 구조를 이해하기 위해 3D CAD 기반으로 모델링과 시각화를 진행한 작업입니다. 단순 외관 표현이 아니라 면 구성, 조립 구조, 실제 제품 형태를 고려해 설계 관점에서 접근했습니다.
UG NX
Automotive Design
3D Modeling
Visualization
HVAC Duct Design
G1UX MCM HVAC Duct Design
자동차 공조 시스템과 내부 패키징 조건을 고려한 HVAC Duct 설계 작업입니다. 공간 제약, 조립성, 공기 흐름, 생산성을 함께 고려해야 하는 기구설계 영역입니다.
Engineering Design
HVAC Duct Package Design
차량 내부 공간과 주변 부품 간섭을 고려해 Duct 형상과 배치 구조를 검토한 작업입니다.
- 공간 제약을 고려한 Duct 형상 설계
- 주변 부품과의 간섭 검토
- 조립성과 양산성을 고려한 구조 정리
UG NX
HVAC Duct
Packaging
Design Review
설계 검토와 모델링 개선
설계 모델은 단순히 형상만 만드는 것이 아니라 실제 조립, 제조, 수정 가능성까지 고려해야 합니다.
- 모델링 수정성과 유지보수 고려
- 양산 전 설계 변경 대응
- 기구설계 관점의 문제 해결
3D CAD
Design Review
Mechanical
Air Duct & Air Induction
Automotive Air Duct & Air Induction Design
자동차에 들어가는 공기 순환 부품은 단순한 플라스틱 형상이 아니라, 엔진룸 패키징, 조립성, 유동 경로, 양산 조건을 함께 고려해야 하는 설계 작업입니다.
C14X Fam-B Air Induction
자동차 Air Induction 설계
자동차 흡기 계통 부품 설계 작업으로, 기능 부품의 구조 안정성과 패키징 조건을 함께 고려한 프로젝트입니다.
UG NX
Automotive Part
Induction
Production Design
양산 조건을 고려한 설계 검토
실제 제품화 단계에서는 디자인 형상뿐 아니라 금형, 조립, 수정성, 협력사 커뮤니케이션까지 고려해야 합니다.
Design Review
Packaging
Assembly
Accessibility & Product Design
사용성과 접근성을 고려한 제품디자인
제품디자인은 예쁜 형태를 만드는 것에서 끝나지 않습니다. 실제 사용자의 행동, 손의 움직임, 사용 환경, 안전성까지 함께 고려해야 좋은 디자인이 됩니다.
Concept Design
일상의 불편함을 개선하는 컨셉 디자인
컨셉 디자인은 현실의 불편함을 발견하고, 더 나은 사용 흐름을 제안하는 작업입니다. 작은 동선 하나만 바뀌어도 제품 경험은 크게 달라질 수 있습니다.
Daewoo Concept Design
90도 회전 벽걸이 세탁기 컨셉
기존 벽걸이 세탁기의 사용 불편을 개선하기 위해 세탁물을 옮기고 꺼내는 동선을 다시 해석한 컨셉 디자인입니다.
- 허리를 숙이는 동작을 줄이는 사용자 중심 설계
- 세탁물 투입과 회수 동선을 고려한 구조 제안
- 제품 사용 경험을 개선하는 회전형 컨셉
Concept Design
Product UX
Home Appliance
User Flow Improvement
사용 동선 중심의 제품 구조
제품디자인은 사용자의 행동을 줄여주는 방향으로 발전해야 합니다. 이 작업은 제품 구조와 사용 동선을 함께 고민한 사례입니다.
UX Design
Ideation
Industrial Design
Public Product Design
양면 버스 하차 단말기 디자인
대중교통 제품은 다양한 사용자가 짧은 시간 안에 정확히 사용해야 하기 때문에 조립성, 방향성, 내구성, 설치 환경을 함께 고려해야 합니다.
Consumer Electronics Design
Internet Router Design
인터넷 공유기 디자인은 제품의 기술적 이미지와 생활공간 속 조화를 함께 고려해야 합니다. 단순 박스 형태를 벗어나 기능성과 시각적 정체성을 함께 설계한 작업입니다.
Reverse Engineering & FEM
UG NX 역설계 모델링과 구조 검토
역설계는 단순히 기존 제품을 따라 그리는 작업이 아니라, 부품의 구조와 조립 관계를 이해하고 다시 설계 가능한 데이터로 정리하는 과정입니다.
CMS & SEO Strategy
웹 디자인과 콘텐츠 운영 포트폴리오
디크리노랗은 디자인과 설계 경험을 웹 콘텐츠로 연결합니다. 워드프레스, 티스토리, 네이버 블로그, 구글 블로그, 라이믹스 기반의 채널 운영 경험을 바탕으로 검색과 AI 검색이 이해하기 쉬운 콘텐츠 구조를 설계합니다.
CMS Architecture
멀티 채널 콘텐츠 운영
워드프레스, 네이버 블로그, 티스토리, 구글 블로그 등 여러 플랫폼을 운영하며 각 플랫폼의 검색 노출 방식에 맞는 콘텐츠 구조를 정리합니다.
- 워드프레스 기반 콘텐츠 허브 운영
- 네이버·구글 검색 노출 구조 분석
- 카테고리, 내부링크, 작성자 신뢰도 개선
WordPress
Tistory
Naver Blog
Blogger
SEO·GEO Content Strategy
검색과 AI가 이해하는 콘텐츠 설계
단순 키워드 반복보다 실제 경험, 작성자 정보, 기준일, 문제 해결 흐름, FAQ, 구조화데이터를 함께 반영해 콘텐츠 신뢰도를 높입니다.
- GEO·AEO 대응형 글 구조 설계
- 작성자 경험과 포트폴리오 연결
- 검색엔진과 사용자 모두 이해하기 쉬운 문서 구성
SEO
GEO
AEO
Schema
Work Process
디크리노랗의 작업 방식
디자인은 감각만으로 완성되지 않습니다. 문제를 정의하고, 구조를 이해하고, 실제로 구현 가능한 방식으로 정리하는 과정이 필요합니다.
1. 문제 관찰
사용자 불편, 설계 조건, 작업 환경 문제를 먼저 정리합니다.
2. 구조 이해
제품 구조, 조립 방식, 프로그램 환경, 검색 구조를 분석합니다.
3. 디자인 구현
3D CAD, 렌더링, 이미지, 웹 콘텐츠로 구체화합니다.
4. 콘텐츠화
실무 경험을 누구나 이해할 수 있는 글과 이미지로 정리합니다.
{
“@context”: “https://schema.org”,
“@type”: “CollectionPage”,
“name”: “디크리노랗 Decreyellow 포트폴리오”,
“url”: “https://decreyellow.co.kr/decre-yellow-portpolio/”,
“description”: “디크리노랗 Decreyellow의 제품설계, 3D CAD, 자동차 부품 설계, 의료기기 R&D, 제품디자인, 렌더링, CMS 운영 포트폴리오입니다.”,
“about”: [
“제품디자인”,
“3D CAD”,
“UG NX”,
“자동차 부품 설계”,
“제품 렌더링”,
“WordPress SEO”
],
“mainEntity”: {
“@type”: “ItemList”,
“itemListElement”: [
{
“@type”: “CreativeWork”,
“position”: 1,
“name”: “G1UX MCM HVAC Duct Design”,
“description”: “자동차 공조 시스템과 패키징 조건을 고려한 HVAC Duct 설계 포트폴리오”
},
{
“@type”: “CreativeWork”,
“position”: 2,
“name”: “Automotive Air Duct & Air Induction Design”,
“description”: “자동차 에어덕트와 에어 인덕션 부품의 최종 양산 설계 포트폴리오”
},
{
“@type”: “CreativeWork”,
“position”: 3,
“name”: “Accessibility Wheelchair Controller UI Design”,
“description”: “전동휠체어 컨트롤러 UI와 접근성 제품디자인 포트폴리오”
},
{
“@type”: “CreativeWork”,
“position”: 4,
“name”: “Daewoo Wall-Mounted Washing Machine Concept”,
“description”: “사용 동선을 개선한 90도 회전 벽걸이 세탁기 컨셉 디자인”
},
{
“@type”: “CreativeWork”,
“position”: 5,
“name”: “Double-Sided Bus Stop Button Terminal”,
“description”: “조립성과 양면 사용성을 개선한 버스 하차 단말기 디자인”
},
{
“@type”: “CreativeWork”,
“position”: 6,
“name”: “Internet Router Product Design”,
“description”: “UG NX, KeyShot, Photoshop 기반 인터넷 공유기 제품디자인”
},
{
“@type”: “CreativeWork”,
“position”: 7,
“name”: “UG NX Reverse Engineering and FEM Simulation”,
“description”: “UG NX 기반 역설계 모델링, Top-Down Design, FEM Simulation 포트폴리오”
}
]
},
“creator”: {
“@type”: “Person”,
“name”: “노랗노랗”,
“alternateName”: [
“Decreyellow”,
“디크리노랗”,
“Design Creator Yellow”
],
“jobTitle”: “디자인 크리에이터·제품설계·3D CAD 콘텐츠 운영자”,
“knowsAbout”: [
“UG NX”,
“AutoCAD”,
“CATIA”,
“Rhino 3D”,
“SolidWorks”,
“Adobe Photoshop”,
“KeyShot”,
“Premiere Pro”,
“WordPress”,
“SEO”,
“제품디자인”,
“자동차 부품 설계”
]
},
“publisher”: {
“@type”: “Organization”,
“name”: “Decreyellow”,
“url”: “https://decreyellow.co.kr/”
}
}
