My UX Work Ethos


This is what I created and wrote and use this when working.
This is what I usually discuss with my UX/UI and web team,interns whom I train, and clients.

A-1

Team Constitution

UX and UI coder
1
I have always made a simple team constitution before starting the project.
2
We discuss it with all team members.
3
This has preferred work times, what happens when one member falls sick, software tools, how we communicate, productivity tips, and other specifics.
E.g. If someone is too shy for video meets, we temporarily allow only audio and written messaging..
4
It is changed to allow all co-workers to work the way they like and feel comfortable.
This increases productivity, work speed, and motivation.
A-2

Project Brief

UX UI coder designer typing on keyboard
1
Team project folders, project management tools, GitHub repos, and other entities are created and shared.
2
The client company, competitors, end-users, and industry are researched.
3
Application and client requirements are collected and the system specification is formulated with approvals.
4
Work breakdown structure is created and tasks are assigned to each team member.
Backup and shadow interns are recruited.
5
Project deliverables, KPIs, milestones, and success measurements are planned and shared.
A-3

Risks and Solutions

UX UI coder designer typing on keyboard
1
No matter how kind the clients are and talented the team is, risks will also show its sinister face.
I always prepare a risk matrix with all the potential project, member, technical, client, and other risks.
This includes risk likelihood, severity, solutions, damage control, and how to monitor risks.
2
We select three alternative strategies to resolve each risk and practise the solutions (risk drills).
3
Then the best team member will be tasked to monitor and enact solutions if the risk takes place.
4
Risks include clients changing requirements mid-way, employee burnout, server over-billing, and database backup failure.
B-1

Documentation and Comments

Comments using concise PHP tags in included HTML files
1
Comment in code - Don't be afraid to write comments!
E.g. Tell why you decided on this function and link to further details.
2
Living and breathing project documentation is created where only a few are editors and all are observers.
3
Each UX, UI, QA, and other teams can maintain their own documentations but there is only one single source of truth.
4
Project documentations should include separate versions for the client, supervisors, auditors, designers, developers, and end-users.
A small summary and latest updates should be written at the top of each document.
5
An updated simple presentation about the project should be maintained for clients.
GIFs of UIs, links to Figma designs, videos of usage can be inserted.
This will help emergency meetings with clients and to save time.
B-2

UI Design, Graphics, and Artwork

1
Create a special hidden layer in Photoshop and Figma with explanations.
This is for other UI and graphic designers and clients.
2
Layers should be properly named according to team guidelines and only use one language.
3
Adopt the atomic or granular workflow where data, elements, assets, frames, and other are properly structured.
4
Always create Figma or other UI components first.
4
Save copyright and authoriship data of every image or asset acquired in a separate directory.
B-3

User Research

1
Plan out what user demographics and traits are required and always conduct a pilot study with a few users.
2
Obtain written or other permission from participants and schedule interviews or focus groups according to their schedule (when they are at ease).
3
Do not assume unknowns before, during, and after usability research.
4
Do guided system user flows with actual end-users when there is a UX designer and developer present.
B-4

User Accessibility

1
List the various groups of potential end-users and conditons, including colour blindness, drunk users, minors by age, and other.
Empathise with each group and plan the application accordingly.
2
Cross-check with WCAG accessibility standards and conduct all four test categories to target a "AAA" grading.
C-1

CSS

1
Create, share, and test the intial CSS components for each device (e.g. ultra wide montiors, laptops, tablets, phablets, smartphones, and smart TVs).
2
Follow the BEM method when using CSS and separate CSS files in to each component family or app section.
3
Use SCSS with BEM and its standards if the project is largescale.
C-2

Testing Live Designs

1
Test under different room and screen environemtns, including with bright room lighting, higher device brightness, blue filters, data savers, and web browser extensions.
2
Automate application usage testing and check if device battery, network data, disk space, memory, and other resources are over-used.
3
Test with all standard browsers in desktop and mobile as well as all resolutions and dimensions of device screens, including both portrait and landscape.
D

And more...

1
Another 42 ethos entities were used in previous projects and teams.


Thank you for your time.
Now, it is your turn to say hi.
WhatsApp icon image
+94 76 460 89 89
Copy Number
This website is 93% hand-crafted © 2022
Animal video by Annie Spratt.

Fly to Top