Processing7 nm
8 cores
Parallel power, mobile thermals.
Up to an AMD Ryzen 9 4900HS brings 16-thread processing to a chassis less than two centimetres thick.
2020 model retrospectiveIndependent student redesign
ROG Zephyrus G14
Desktop-class ambition, distilled into fourteen inches. A front-end study in presenting power without visual noise.
01 AniMe Matrix lid
02 14-inch footprint
- 14″
- compact display
- 8C / 16T
- up to Ryzen 9
- RTX 2060
- up to 6 GB GDDR6
- 76 Wh
- four-cell battery
01 / Overview
A gaming machine that learned how to travel.
The original G14 challenged the idea that serious laptop performance required a large chassis. Its pitch was a deliberate balance: an eight-core mobile processor, dedicated graphics, colour-accurate display options, and a body starting at 1.6 kg.
This redesign turns that balance into the visual system. Dense specifications sit inside a spacious editorial layout, while electric cyan and signal red identify the moments that deserve attention.
02 / Core system
Built around four tensions.
Power and restraint. Speed and endurance. Gaming and creative work. Hardware and identity.
GraphicsTuring
2060 RTX
Real-time graphics.
Configurations reached an NVIDIA GeForce RTX 2060 Max-Q with 6 GB of GDDR6 memory.
DisplayPantone validated
Choose fluidity or detail.
The 2020 family offered a 120 Hz Full HD panel or a higher-resolution 60 Hz WQHD option, both with 100% sRGB coverage.
Identity1,215 LEDs
AniMe Matrix
The lid became a canvas.
Selected configurations turned the laptop cover into a programmable monochrome display for text, graphics, and animation.
MobilityGA401
Small enough to leave the desk.
A 14-inch footprint and 76 Wh battery made the G14 a credible work-and-play machine away from a permanent setup.
03 / Architecture
Performance is a system, not one component.
- 01 Compute Ryzen 4000 HS-series
- 02 Render Dedicated GeForce graphics
- 03 Move heat Dual-fan thermal design
- 04 Present Fast, colour-aware panels
04 / Specifications
2020 GA401 family.
Configurations varied by market. This is a concise range overview, not a current sales listing.
| Processor | Up to AMD Ryzen 9 4900HS | 8 cores / 16 threads, up to 4.3 GHz |
|---|---|---|
| Graphics | Up to NVIDIA GeForce RTX 2060 Max-Q | 6 GB GDDR6 |
| Display | 14-inch FHD 120 Hz or WQHD 60 Hz | IPS-level, anti-glare, 100% sRGB |
| Memory | Up to 32 GB DDR4-3200 | Dual-channel support |
| Storage | Up to 1 TB M.2 NVMe SSD | PCIe 3.0 |
| Wireless | Wi-Fi 6 (802.11ax) | Bluetooth 5.0 |
| Battery | 76 Wh, four-cell lithium-ion | 180 W adapter on performance configurations |
| Weight | From 1.6 kg | Approximately 1.7 kg with AniMe Matrix |
| Dimensions | 32.4 × 22.2 cm | 1.79–1.99 cm thick, depending on configuration |
Specification summary cross-checked against ASUS/ROG material for the original 2020 GA401 family. Exact availability differed by region.
05 / Portfolio rebuild
From coursework upload to intentional front-end work.
The first version proved that I could assemble a multi-page HTML/CSS experience. This rebuild focuses on what matters in professional front-end delivery: purpose, hierarchy, accessibility, maintainability, and honest product framing.
Structure
OriginalFour loosely connected pages and repeated stylesheets.
RebuildOne semantic narrative with a single design system.
Visuals
OriginalHotlinked product imagery and a promotional video.
RebuildOriginal CSS-built hardware artwork and motion.
Behaviour
OriginalFixed dimensions and decorative colour animation.
RebuildResponsive layouts, useful interaction, and reduced-motion support.
Framing
OriginalSign-in and contact pages implied a functioning storefront.
RebuildAn explicit independent study with no data-collecting forms.
What changed most
Design is editing. The strongest decision was not what to add, but what to remove so the product—and the work behind it—could speak clearly.
Built withSemantic HTMLModern CSSVanilla JavaScriptResponsive designAccessibility