ArkPi
Arkpi is a software platform helping teams manage complex project workflows. With a growing product suite, they needed a design system that could scale consistently across multiple interfaces.
Industry
Software / SaaS
Company Size
Under 50
Timeline
8 Weeks
How Arkpi built a scalable design system from a fragmented visual identity.
The situation
A growing product with no shared design language holding it together.
Arkpi's interface had been built incrementally by different contributors over time. The result was a fragmented visual experience — inconsistent component styles, multiple unofficial colour systems, and no single source of truth for how the product should look and behave. Every new feature required starting from scratch, and inconsistencies were multiplying faster than they could be resolved.
What we did
A complete design system audit, component library, and implementation guidelines.
We audited every interface state, component, and pattern across the product — cataloguing what existed, identifying inconsistencies, and defining the canonical versions. We built a structured component library in Figma, documented usage guidelines and accessibility requirements for each component, and worked with the development team to implement the system in production. The result: a single shared design language that every contributor now works from.
The results
Arkpi went from a product where every new feature required design decisions to be remade from scratch, to one where the shared system made those decisions in advance. The efficiency gain was immediate; the compounding benefit continues.
A unified design system covering all core product interfaces
Component library in Figma with documented usage guidelines and accessibility notes
Design production time reduced by approximately 40% within three months of implementation
Inconsistencies eliminated across the product — one visual language, consistently applied
New contributors onboard to the system in under a day
Juggling everything as a small business owner is tough, and my initial website was basic, costly, and a pain to maintain. Noran transformed my online presence by capturing the true spirit of my brand and delivering a robust, responsive website beyond what would have been possible by myself.
Jonathen Chen
Founder, Arkpi
More cases.
Trusted by more than 50 companies, from ambitious startups to major enterprises.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 45 6" xmlns="http://www.w3.org/2000/svg"><g d="M 0.723 5.042 L 0.723 0.454 C 0.557 0.346 0.249 0.262 0 0.239 L 0 0.191 L 2.406 0.012 L 2.347 0.896 L 2.347 1.063 C 2.856 0.693 3.792 0 4.871 0 C 5.618 0 6.649 0.37 6.649 2.175 L 6.649 4.756 C 6.649 5.401 6.756 5.628 7.111 5.867 L 4.954 5.867 L 5.025 5.042 L 5.025 2.199 C 5.025 0.86 4.599 0.562 4.065 0.562 C 3.33 0.562 2.738 1.064 2.346 1.362 L 2.346 4.756 C 2.346 5.401 2.453 5.628 2.809 5.867 L 0.651 5.867 L 0.722 5.042 Z M 7.867 2.978 C 7.867 1.22 9.121 0 11.067 0 C 13.013 0 14.267 1.184 14.267 2.978 C 14.267 4.772 13.013 5.956 11.067 5.956 C 9.121 5.956 7.867 4.772 7.867 2.978 Z M 11.532 5.753 C 12.368 5.753 12.714 5.047 12.714 3.947 C 12.714 2.344 12.034 0.203 10.601 0.203 C 9.765 0.203 9.418 0.897 9.418 2.033 C 9.418 3.612 10.111 5.752 11.532 5.752 L 11.532 5.753 Z M 15.748 5.041 L 15.748 0.443 C 15.581 0.336 15.272 0.252 15.022 0.227 L 15.022 0.18 L 17.436 0 L 17.376 0.886 L 17.376 1.269 L 17.53 1.269 C 17.804 0.503 18.447 0 19.291 0 C 19.54 0 19.73 0.036 19.956 0.143 L 18.72 2.227 L 18.672 2.227 C 18.934 1.532 18.732 0.886 18.268 0.886 C 17.745 0.886 17.472 1.592 17.376 2.43 L 17.376 4.754 C 17.376 5.4 17.483 5.628 17.84 5.867 L 15.688 5.867 L 15.747 5.04 L 15.748 5.041 Z M 25.03 5.63 L 25.041 5.619 C 24.66 5.822 24.184 5.941 23.625 5.941 C 21.864 5.941 20.756 4.867 20.756 3.221 C 20.756 1.48 21.97 0 24.506 0 C 25.268 0 26.149 0.143 26.959 0.441 L 26.959 4.879 C 26.959 5.523 27.066 5.726 27.423 5.965 L 27.423 6 L 25.03 5.63 Z M 24.399 5.547 C 24.756 5.547 25.065 5.392 25.303 5.13 C 25.315 5.046 25.327 4.915 25.327 4.724 L 25.327 0.883 C 24.946 0.477 24.53 0.226 23.982 0.226 C 22.899 0.226 22.363 1.145 22.363 2.529 C 22.363 4.258 23.244 5.546 24.399 5.546 Z M 28.901 5.042 L 28.901 0.454 C 28.734 0.346 28.427 0.262 28.178 0.239 L 28.178 0.191 L 30.584 0.012 L 30.525 0.896 L 30.525 1.063 C 31.035 0.693 31.971 0 33.049 0 C 33.796 0 34.827 0.37 34.827 2.175 L 34.827 4.756 C 34.827 5.401 34.934 5.628 35.29 5.867 L 33.132 5.867 L 33.203 5.042 L 33.203 2.199 C 33.203 0.86 32.777 0.562 32.244 0.562 C 31.509 0.562 30.916 1.064 30.525 1.362 L 30.525 4.756 C 30.525 5.401 30.631 5.628 30.987 5.867 L 28.83 5.867 L 28.901 5.042 L 28.901 5.042 Z M 40.66 5.882 C 39.809 5.882 39.118 5.191 39.118 4.34 L 39.118 1.542 C 39.118 0.69 39.809 0 40.66 0 L 43.458 0 C 44.31 0 45 0.69 45 1.542 L 45 4.34 C 45 5.191 44.31 5.882 43.458 5.882 Z M 40.66 5.882 C 39.809 5.882 39.118 5.191 39.118 4.34 L 39.118 1.542 C 39.118 0.69 39.809 0 40.66 0 L 43.458 0 C 44.31 0 45 0.69 45 1.542 L 45 4.34 C 45 5.191 44.31 5.882 43.458 5.882 Z" fill="transparent" height="6px" id="VtbxCpYil" transform="translate(0 0.24)" width="45px"><path d="M 0.723 5.042 L 0.723 0.454 C 0.557 0.346 0.249 0.262 0 0.239 L 0 0.191 L 2.406 0.012 L 2.347 0.896 L 2.347 1.063 C 2.856 0.693 3.792 0 4.871 0 C 5.618 0 6.649 0.37 6.649 2.175 L 6.649 4.756 C 6.649 5.401 6.756 5.628 7.111 5.867 L 4.954 5.867 L 5.025 5.042 L 5.025 2.199 C 5.025 0.86 4.599 0.562 4.065 0.562 C 3.33 0.562 2.738 1.064 2.346 1.362 L 2.346 4.756 C 2.346 5.401 2.453 5.628 2.809 5.867 L 0.651 5.867 L 0.722 5.042 Z M 7.867 2.978 C 7.867 1.22 9.121 0 11.067 0 C 13.013 0 14.267 1.184 14.267 2.978 C 14.267 4.772 13.013 5.956 11.067 5.956 C 9.121 5.956 7.867 4.772 7.867 2.978 Z M 11.532 5.753 C 12.368 5.753 12.714 5.047 12.714 3.947 C 12.714 2.344 12.034 0.203 10.601 0.203 C 9.765 0.203 9.418 0.897 9.418 2.033 C 9.418 3.612 10.111 5.752 11.532 5.752 L 11.532 5.753 Z M 15.748 5.041 L 15.748 0.443 C 15.581 0.336 15.272 0.252 15.022 0.227 L 15.022 0.18 L 17.436 0 L 17.376 0.886 L 17.376 1.269 L 17.53 1.269 C 17.804 0.503 18.447 0 19.291 0 C 19.54 0 19.73 0.036 19.956 0.143 L 18.72 2.227 L 18.672 2.227 C 18.934 1.532 18.732 0.886 18.268 0.886 C 17.745 0.886 17.472 1.592 17.376 2.43 L 17.376 4.754 C 17.376 5.4 17.483 5.628 17.84 5.867 L 15.688 5.867 L 15.747 5.04 L 15.748 5.041 Z M 25.03 5.63 L 25.041 5.619 C 24.66 5.822 24.184 5.941 23.625 5.941 C 21.864 5.941 20.756 4.867 20.756 3.221 C 20.756 1.48 21.97 0 24.506 0 C 25.268 0 26.149 0.143 26.959 0.441 L 26.959 4.879 C 26.959 5.523 27.066 5.726 27.423 5.965 L 27.423 6 L 25.03 5.63 Z M 24.399 5.547 C 24.756 5.547 25.065 5.392 25.303 5.13 C 25.315 5.046 25.327 4.915 25.327 4.724 L 25.327 0.883 C 24.946 0.477 24.53 0.226 23.982 0.226 C 22.899 0.226 22.363 1.145 22.363 2.529 C 22.363 4.258 23.244 5.546 24.399 5.546 Z M 28.901 5.042 L 28.901 0.454 C 28.734 0.346 28.427 0.262 28.178 0.239 L 28.178 0.191 L 30.584 0.012 L 30.525 0.896 L 30.525 1.063 C 31.035 0.693 31.971 0 33.049 0 C 33.796 0 34.827 0.37 34.827 2.175 L 34.827 4.756 C 34.827 5.401 34.934 5.628 35.29 5.867 L 33.132 5.867 L 33.203 5.042 L 33.203 2.199 C 33.203 0.86 32.777 0.562 32.244 0.562 C 31.509 0.562 30.916 1.064 30.525 1.362 L 30.525 4.756 C 30.525 5.401 30.631 5.628 30.987 5.867 L 28.83 5.867 L 28.901 5.042 L 28.901 5.042 Z" fill="rgb(0, 0, 0)" height="6px" id="FMVP_mHbr" width="35.289777450701024px"/><path d="M 1.542 5.882 C 0.69 5.882 0 5.191 0 4.34 L 0 1.542 C 0 0.69 0.69 0 1.542 0 L 4.34 0 C 5.191 0 5.882 0.69 5.882 1.542 L 5.882 4.34 C 5.882 5.191 5.191 5.882 4.34 5.882 Z" fill="rgb(214, 235, 220)" height="5.88168036998972px" id="ZQ550b6a5" transform="translate(39.118 0)" width="5.881629943847656px"/><path d="M 1.542 5.882 C 0.69 5.882 0 5.191 0 4.34 L 0 1.542 C 0 0.69 0.69 0 1.542 0 L 4.34 0 C 5.191 0 5.882 0.69 5.882 1.542 L 5.882 4.34 C 5.882 5.191 5.191 5.882 4.34 5.882 Z" fill="rgb(69, 125, 97)" height="5.88168036998972px" id="zd16TqCwX" transform="translate(39.118 0)" width="5.881629943847656px"/></g></svg>)
