INTRODUCTION TO DOCUSIGN
DocuSign is leading company in the realm of digital transaction management, and contracts. Providing organizations and individuals a secure and efficient way to collect electronic signatures. With their Dev API tools, DocuSign empowers developers to seamlessly integrate the power of their platform into a variety of applications and workflows. The DocuSign API offers a robust set of features, including document creation, sending and signing, authentication, and data management, enabling developers to enhance the efficiency, security, and compliance of their document processes.
THE CHALLENGE
When I joined the team, I was faced with the challenge of extending the existing API website design from desktop to mobile and tablet devices. This task was made more urgent as the lead designer had unexpectedly taken a leave of absence. To ensure that the project didn't lose any momentum, I had to quickly familiarize myself with the company's branding standards and design system. However, it soon became apparent that their design system lacked components specifically tailored for mobile and tablet experiences. In order to stay on track with the project timeline, it was crucial to develop responsive components that would adapt seamlessly to different screen sizes. Another obstacle I encountered was the documentation pages that explained how to implement and manage these APIs in users' own applications. These pages had a complex and convoluted navigation structure, which made it difficult for users to find the information they needed, especially when accessing them on mobile devices where the page names often got truncated or sections were easily overlooked.
THE PROCESS
To expedite the development of all the required screens, I embarked on building reusable components specifically designed for tablets and mobile devices. This approach also entailed adjusting typography sizes, side margins, and tap/click areas in the navigation, buttons, and other interactive elements to ensure a smooth and user-friendly experience across various screen sizes. Starting with the components that were common to all screens, such as the navigation and footer, allowed me to establish a solid foundation. By creating these reusable building blocks, I not only saved time but also maintained consistency throughout the API marketing and documentation pages. This systematic approach enabled me to efficiently implement the necessary changes and ensure that the mobile and tablet versions of the website were coherent with the established desktop design.
THE OUTCOME
In conclusion, the task of extending the API website design to mobile and tablet devices presented a significant challenge that required swift action. By developing reusable components tailored for tablets and mobiles, starting with common elements like navigation and footer, I not only streamlined the development process but also ensured consistency throughout the website. Ultimately, this approach allowed me to successfully translate the desktop design into an engaging and user-friendly experience for mobile and tablet users.