Spark Design System
A detailed case study on how a scalable design system for a new British Gas product was created from scratch
Industry:
- Utility
👋🏽 Hi! I'm Awais,
I'm a Senior Product Designer having expertise in Experience design/UI design and Front-end engineering.
Keeping focus on the User, I aim to deliver end-to-end design starting with research and analysis to identify problems and user pain points, then translate the findings into testable solutions & prototypes and then design/develop visually aesthetic and responsive user interfaces.
I specialise in commissioning and maintaining Design Systems to instill cohesion and consistency among organisation wide projects, and also Design operations focusing on tools, resources, processes and ways of working.
SHOWCASE
Here are some of the case studies of my recent work
PROFILE
- face
Awais Waheed
- location_on
London
- alternate_email
awais@alwaysawais.com
- assignment_ind
Download my CV
My skill set offers to facilitate a digital product development lifecycle highlighting the process of research, strategy, prototyping, visual design and front-end development.
I come with a vast experience leveraging modern UI design tools and JavaScript to prototype/design/build responsive websites, mobile apps, and interactive features that drive business growth and improve user experience.
In my most recent roles, I've led design teams to produce beautiful and intuitive experiences that are functional and accessible, on the back of research and testing.
At a glance
- Hybrid Designer/Developer : UX/UI Designer with hands on experience of Front-end Development
- Design Ops & Design systems setup and maintainence
- 15+ years experince working with large enterprises as well as start-ups
- Agile (Scrum/Kanban) as well as Linear (Waterfall) workflow experience
- Masters degree : New media Art & Design
- First degree : Computer Sciences (BCS)
Experience
British gas
Design System Lead • Nov 2021 - Mar 2023
- Design ops setup consisting of devising team/project structure, organising ways of working and design processes.
- Setup and maintenance of Design Systems/UI kits for multiple brands.
- Mentoring and training the design team through workshops and learning sessions.
- Defining and testing efficient and coherent ways of working and collaboration workflow.
- Research and User testing.
- Figma plugin development.
Autodesk
Senior UX/UI Designer • Apr 2021 - Nov 2021
- Helping with finding solutions for complex cloud based (Saas Platform) construction management products.
- Ideation and exploration.
- Wireframing and Prototyping.
- Simple solution of complex problems through different ways of UX mapping.
- Creation of bespoke Wireframe library and file structure template.
- Mentoring the team on Figma as a design and prototyping tool.
Sainsbury's / Argos
Lead UX/UI Designer / UI Developer • Mar 2019 - Apr 2021
- A sole UX/UI designer on an internally used Application which enables agents at call centre to carry out operations facilitating end customers.
- Carrying out user research along with business requirement gathering and producing prototypes showing an optimised user experience and business value.
- Developing agent facing UI design system.
- Providing a first class support on the front end needs working with the dev team on the stack which involves React JS, Typescript, Redux and taking the ownership of components and assets in Storybook js.
- Working closely with Product Owners and BAs and with dev knowledge pointing out the build feasibility and potential dev limitations early on.
Semantic Integration
Lead UX/UI Designer • Jan 2019 - Feb 2019
Semantic Integration is a Data-driven Solutions and Consulting agency working with high end clients like Pearson. I was hired for a very short UX project at Pearson working on their internal app which facilitates asset management. I conducted user research and proposed solution through wireframes and highly interactive prototypes built in Axure RP, conducted user testing sessions and provided an highly optimised solution which fit user needs and business requirements.
Affinion International
Lead UI-UX Designer / Front-End Developer • Jul 2014 - Nov 2018
Affinion International is an affiliate marketing company mainly running loyalty and customer engagement programs with some industry leading clients. At Affinion international I was leading on most of the fintech projects, working on the UX strategies and visual creatives, building high end interactive clickthrough prototypes, providing polished pixel perfect UIs and also mentoring junior designers. On the dev side, coding the front end part using the modern web building technologies and frameworks, working with Rest APIs and state management tools.
Superdrug
Front-end Developer / UI Designer • Jul 2012 - Jul 2014
One of the largest health and beauty retailer, at Superdrug I worked on Superdrug's new website built from scratch both for desktop and mobile devices. I've been responsible to lead the Front-end dev which included translation of the wireframes and UI designs into functional front end interface coded in HTML, CSS, XML, jQuery and JSON.
Coral
Visual Designer • May 2012 - Jun 2012
Coral is a leading European betting and gaming company with strong market positions, high growth and well-established brands. Here I had an opportunity to work as a Creative designer and helped them with High End graphics for various divisions of the business. Most of the creatives included gaming Banners. It was a combination of static and animated flash banners that I produced while working here for a couple of months.
Kaplan International
UI Designer/Developer • Aug 2010 - Apr 2012
Kaplan is a premier provider of educational services for individuals, schools, and businesses worldwide. At Kaplan my responsibilities included designing concepts and then converting the designs into coded pages using HTML, CSS, JS and non flash elements using jQuery framework, responsive websites coded in HTML5 CSS3 and Jquery. Strict cross browser optimization, testing of pages on Litmus. Design and development of email campaigns via dotmailer and cheetahmail.
Others
Profero
Flash Designer • Aug 2010
Totallymoney
UI Designer/Developer • May 2010 - Jul 2010
Harvest Digital
UI Designer/Flash Designer • Feb 2010 - Apr 2010
Dodec
UI Designer/Flash Designer • Jul 2009 - Feb 2010
Mytherapy
Flash Designer/Developer/Web Designer • Apr 2007 - Oct 2008
Education
Masters (New Media Art & Design)
2009 • University of West London
Bachelors (Computer Sciences)
2002 • University of central Punjab, Lahore
Certification in Design and Multimedia
2003 • Peak Solutions (Pvt) Ltd
Skills
Management
- Design ops setup
- Project planning & management
- Communication & collaboration
- Design & Ideation workshops
- Mentorship & team training
UX
- Insights analysis
- User research
- Experience mapping
- Information architecture
- User flows / journeys
- Wireframing & Prototyping
- Usability testing
UI
- Visual design
- Design systems
- Design principles
- Layout and composition
- Brand refresh
- Accessibility
Development
- HTML / CSS / JS
- Figma Plugin/Widgets dev
- Version control
- Unit test
- Build and deploy
I use the following tools/libraries/frameworks/softwares to aid the processes for User Experience(UX), User Interface Design(UI) and Front-end Development(FED) to build beautiful and useful visual interfaces.
UX
Figjam
Miro
Axure RP
UX Pin
XD
Userzoom
Whiteboard
UI
- Figma
Sketch- XD
Illustrator
Photoshop
Zeplin
Invision
FED
HTML/CSS
Sass
React
Redux
Storybook
Bootstrap
Git
