Enter Password
Designed and built a responsive corporate website for a Japanese interior design firm, establishing a credible digital presence and showcasing their portfolio.
June ~ August 2022
UX/UI Designer
Web Developer
株式会社D・アクティブ
(D active)
Figma
Zoom
Notion
Webflow
Visual Studio Code
Despite strong business growth and a growing client base, D Active lacked an official website, which impacted credibility when engaging with prospective clients. The challenge was to establish a digital presence that effectively communicates trust, professionalism, and the company’s design expertise.
Designed a responsive corporate website for D Active that clearly communicates the company’s identity, services, and credibility to first-time visitors. The design aligns with contemporary Japanese UI patterns, remains consistent with existing branding colors, and effectively showcases a diverse project portfolio.
I conducted a stakeholder interview with the CEO of the company to define goals, constraints, and target audience within a tight timeline. A key insight was that the absence of a website undermined the company’s credibility, despite its diverse client base.
The design needed to balance a modern, trend-forward aesthetic with existing brand guidelines, while effectively showcasing the company’s work and growth to prospective clients.
I analyzed interior design and renovation websites to identify common patterns in information architecture, content structure, and visual direction. These insights informed both the overall layout and user flow of the site.
In parallel, I explored color palettes that aligned with the existing brand while supporting a more modern and cohesive visual identity.
Snippet of the references and colors I gathered
Starting from an initial wireframe provided by the PM, I developed mid-fidelity wireframes for the homepage, refining layout and visual direction. I established key visuals early and validated the direction with stakeholders before scaling to additional pages.
I also created the tagline, “Create Delightful Dreams with Direct Design Direction,” incorporating the client’s request to include these five “D” concepts.
Based on client feedback, I evolved the visual direction to feel more vibrant and playful (“遊び心”), addressing concerns that the initial key visual appeared too subdued. I introduced a brighter, blue-forward palette and expanded the key visual to better showcase the diversity of the client’s work.
I then extended the design across additional pages, including mobile, ensuring a consistent and cohesive visual experience.
Homepage, before and after
Additional wireframes for the subpages
To strengthen credibility and transparency, I introduced a testimonial section and expanded the number of showcased projects, adding tags for quick scanning. I also incorporated imagery of team members and construction processes to provide greater visibility into the people and work behind each project.
After finalizing the designs, I built the site using webflow, a low code tool, before handing it off to a back-end engineer for WordPress implementation and final adjustments. I collaborated closely with the back-end engineer to ensure design fidelity and supported minor front-end adjustments during handoff.
Working across both design and development helped me better understand technical constraints, allowing me to design with feasibility and implementation in mind.
The website was launched, establishing D Active’s digital presence and improving credibility with prospective clients.
This project reinforced the importance of proactive communication across both clients and engineering teams. Aligning expectations early, while clearly translating ideas into concrete design outcomes, helped reduce ambiguity and minimize revisions. Close collaboration with engineers was equally critical to ensure design fidelity and maintain consistency through implementation.
What I would improve
With more time, I would further strengthen alignment by introducing more structured design reviews and documentation to streamline feedback and handoff.
© 2026 Crystal Ma. All rights reserved.