Interaction design | in-app animation
EquityOnline is an initiative by Equity Group to revamp their online services, by creating an Omni-channel that would serve their customers within the subsidiaries in eastern and central Africa, and offer them digital financial access to the rest of the world
TASK AT HAND
Part of the initiative was new platforms, on mobile (android and iOS) and on web. The task here was to serve as the motion and interaction designer for the platforms, and to maintain that aspect within the design system
As the initiative evolved, my role transitioned more into UX/UI where i had more tasks in feature development and eventually, leading UX teams that were also developing features for the app and web
PROCESS
Due to the evolution of the project, different processes had to be undertaken to serve the evolving needs of the platforms and the teams working on them. Since Equity group is a prominent financial institution, the motion had to be smooth and neat to achieve a professional fell that is not overwhelming
Interaction design
Since I was brought in before the launch of the project, I was fully involved in the designing of the screens, and took up several design taks too. As such, I had more say and influence in how the designs would work once interaction and motion came in. Since the screens would be in the hundreds, I decided to make a motion guide, which captured how each component, screen, is supposed to interact with the other. I did demos for an easier time presenting and conceptualizing for the developers and other stakeholders
While at it, I also made some in-app and on-web animations. I provided splash screens, loaders, animated Get Started screens, all for mobile and web, for normal and dark mode. These were made in json file format, supported by the lottie tools, for smooth and extremely lightweight, resizable files
UX/UI
I got to work in a UX capacity where I designed several features. The business leads would come up with feature requirements, based on their research, customer or business needs, and I would read and interpret the requirements to reflect them in the UI screen. For some of these screens, I would prototype the outcome, which would be used for user testing and demos. This resulted in being involved in accessibility testing and further research
With time, I got to lead and manage teams developing features as the lead designer, which led to more interaction with business leads and developers. This also meant I had to further contribute to the updating and maintaining of the design system we were using.
Promo video
Given my familiarity with the screens and my motion background, I decided to animate a promo video for the mobile app stores, for a richer experience while downloading the app and to give a sneak peak of the features the apps hosted
The promo video is to be released with the launch of the app in its next version
Take away
The biggest challenge in this project was the breaking down of requirements. In the UX capacity, I was challenged to make sense out of different sets of requirements and make a user journey that would give the best user experience, since they were not always well defined. However, in the challenge, I was able to sharpen my skills and eventually able to handle such situations, for myself and teams I led
