Web Design
Focused on integrating visual design and user experience
We create brand-aligned, user-friendly websites that leave a strong impression and help visitors find what they need quickly.
① Requirements Discovery & Analysis
>>
⠿ Goal Alignment · Requirement Gathering · Competitive Analysis
Through in-depth interviews, we gain a clear understanding of business goals, brand characteristics, and budget considerations. We gather key insights—including website purpose, target audience, functional needs, and competitor analysis—to build a solid foundation for planning and design.
Based on the available budget, we propose tailored solutions to ensure goals are achieved efficiently and realistically.
② Planning & Information Architecture
>>
⠿ Site Structure Definition · Wireframes
We define page structure and content hierarchy through a sitemap, then use wireframes to design core layouts, key elements, and interactions. Combined with UX principles, we optimize user flows and navigation to ensure a smooth and intuitive browsing experience.
③ Visual Design
>>
⠿ Style Definition · Initial Design Concepts
We define the visual direction based on brand identity, designing key elements such as color, typography, and icons. Initial concepts are created for the homepage and key pages to present the overall look and feel. Based on client feedback, visual details are refined to ensure the design reflects brand value and quality.
④ Website Development
>>
⠿ WordPress Implementation · Front-end & Back-end Development
Front-end development delivers responsive layouts for smooth performance across devices, while back-end development builds custom modules to meet diverse needs. Through testing and integration, we ensure stable and reliable functionality.
For cost efficiency, WordPress-based solutions are also available—offering flexibility, practicality, and strong value.
⑤ Testing & Optimization
>>
⠿ Functionality · Compatibility · Performance
We conduct functional testing to ensure all modules work reliably, perform cross-browser testing for consistent behavior across Chrome, Safari, and Firefox, and optimize speed and performance to deliver a stable, efficient, and high-quality user experience.
⑥ Launch & Deployment
>>
⠿ Site Deployment · Final Testing
We manage the full deployment process—from server and domain setup to uploading all site files—to ensure accuracy at every step. Clients may choose custom server deployments or professional WordPress hosting for improved stability and performance.
After deployment, final testing is conducted to ensure all functions run smoothly and the site is ready for launch.
Six Types of Web Motion
We will introduce how I use them in two separate articles: [ Prototyping ] and [ Animation Design ].
Motion brings designs to life, helping products stand out. It communicates system states, improves navigation transitions, and provides visual feedback—when used thoughtfully, it significantly enhances user experience and usability.
01
Lottie Animations
Lottie animations are lightweight, JSON-based animations powered by JavaScript and are one of the most effective animation solutions today. They offer small file sizes for faster loading, developer-friendly control over animation parameters, resolution-independent vector quality, and cross-platform compatibility across devices and environments.
02
SVGA Animations
SVGA is a high-performance animation format compatible with iOS, Android, Flutter, and the Web. It delivers smooth animations with efficient performance and consistent visual quality, making it ideal for both mobile and web applications.
03
High-Fidelity Interactive Prototypes
“So real, it feels finished.” By validating high-fidelity prototypes with clients early and gathering in-depth feedback, we confirm designs before handoff to development. This significantly reduces wasted time and resources, improves design accuracy, and ensures the final product meets real needs—avoiding late-stage changes and rework.
04
Motion Video
Motion video quickly captures attention, delivers brand messages clearly, and strengthens recall. It enhances product perception while making UI/UX more engaging—helping users understand interfaces intuitively and improving overall experience. With its flexibility and visual impact, motion has become a key element in modern design.
05
Animated GIFs
Photoshop is suitable for simple animations, while more complex motion is better handled with Adobe Animate. For highly complex animations, video formats are recommended, as GIF files can become large and negatively impact performance.
06
HTML5 Canvas
Many overlooked Adobe Animate after the decline of Flash, unaware that it has evolved into a key tool for creating H5 animations. Over time, Animate is also moving toward supporting Lottie exports. While challenges remain, it is steadily becoming an important tool in modern motion design
