Imogie Mubarak

THE PORTFOLIO OF IMOGIE MUBARAK UX/UI DESIGNER DESCRIPTION Buffrspace is a platform that allows remote workers, business travelers, distributed teams and freelancer’s rent available workspaces on-demand. ROLE User Experience and Interface redesign for the website using an already defined style guide. DESIGN THINKING Users of the platform are expected to always be on the go. Therefore there was a main focus on mobile responsiveness and clarity. I established a page design system where each page has atleast 1 image of a work area, this was to reinforce the concept of the product. Using the existing color scheme, I settled with a clean theme with limited use of strokes/borders PROCESS OVERVIEW Due to time constraints, I started with High Fidelity prototypes supported by animations of micro- interactions to better commmunicate my design to the dev team. I also designed icons and illustrations to add a unique feel to the design. 2 SUREREMIT Android & iOS App DESCRIPTION SureRemit allows users send electronic gift vouchers that can be used to purchase goods and services at several quality merchants across Africa in a few easy Something went wrong Payment was unsuccesful. Your credit card was not charged steps. ROLE I was responsible for defining the look and feel, page transitions and user experience of the app. I also CANCEL TRY AGAIN designed emails that are received by users when vouchers are sent. DESIGN THINKING Because of the simplicity of the app and the linear direction to which tasks are completed, I decided to go with bold text and big ui elements/buttons. The key tasks on the app can be completed in at most 4 easy steps. Each page in the process has a stepper to show progress and how many more steps remain. Smile Pay per use top up Smile Communications provides 4G LTE mobile broadband in several countries in Africa. Our objective is to become the broadband provider of choice for SuperFast mobile broadband internet and SuperClear voice services PROCESS OVERVIEW I started by creating low fidelity wireframes for each step required in completing a task. Wireframes were then converted to High fidelity prototypes using Sketch. With main inspiration drawn from material design principles for motion, page transitiions were OK prototyped using PrincipleforMac. DESCRIPTION Truppr is a social tool that helps sport lovers organize and find team mates for their favorite sports in cities around the world. ROLE These was a design competition and contestants were expected to deliver a redesign of key pages in the website (landing page, event listing, sign up and single event page). This entry won the competition. DESIGN THINKING My goal was to design a landing page that made it easy for discovery of sport events while also promoting the existing mobile app by adding a block that showed it’s benefits which the initial design had non of. Truppr also let’s user find sports trainers so there’s a block to find a trainer based on the city you’re in. PROCESS OVERVIEW I used hand drawn sketches to quickly define the arrangement of elements on each page before designing high fidelity prototypes. Web Application DESCRIPTION A web platform that allows corporate entities send gift vouchers in bulk to their customers and staffs. ROLE I was responsible for defining the look and feel, page structure and user experience and interaction of the web app. I also designed themed gift card templates that can be modified by the user and a template builder. DESIGN THINKING It was important that the process of building and modifying gift cards was as simple as possible hence the introduction of themed templates. There are currently 6 categories with 2 templates each with more to be added in the future. The app also has a calender to manage events like public holidays, weddings, and birthdays that would require the sending of gift cards. PROCESS OVERVIEW I progressed through hand drawn skethces to high fidelity wireframes, drawing inspiration from web apps that allow the user create designs from templates like Mailchimp and Canva. DESCRIPTION Haute is a productive tool for tailors and fashion designers to manage their customers and creative process. ROLE I was responsible for the user experience, interface and interaction design. I designed custom icons for parts of the app based on the chosen color scheme. I also participated in conducting user intefviews to determine a product-market fit. DESIGN THINKING The goal was to design an app with a simple and clean user interface using material design. I chose a simple color scheme with 1 accent color and varying shades of grey, this was to help keep the focus on the components of the interface and amplify the white space. I used tabs for navigation as opposed to the harmburger menu to allow easy access. I picked the accent color based on it’s significance in fashion (Purple represent luxury and the app is named Haute which is french for ‘High End’) PROCESS OVERVIEW I made hand drawn sketches of the initial concept to help with the user interviews. After the interviews, the feedback gotten influenced the low fidelity wireframes from which high fidelity prototypes were made.