UX/UI + Visual Design.
Brand Style Guide & UX Process.
Here are a below projects I have worked with for branding and UX/UI. Due to the UX/UI project being a nature of IP for confidentiality, I am only able to write about my experience and knowledge with UX/UI Design project.
Please scroll below to see the (1) Brand Style Guides ('1999 House of Nails' is a work-in-progress and not yet released) I have created for my clients and (2) the UX/UI Design Process experience breakdown.
I have worked on several UX/UI roles in the past, such as redesigning a website for User Friendly Resources, Edumaxi and app design. In the below paragraph, I would like to go over my experience as a UX/UI designer for a start-up company I have worked with known as 'Vanteks'.
For Vanteks, I have been a part of the development process such as creating User Flow Charts, Lo-Fi wireframing, Style Tile, Research, User Testing, Hi-Fi Prototype and working closely with the developer to develop the application for the IoT posture motion-tracking device.
Due to the nature of the project (IP), I can only show parts of the project (the below shows the style tile and the user flow chart that I have created) and the process cannot be shared further. However, do feel free to check out my project I have created back in University for my IoT UX/UI Design Process example here:
See below for the typical process of a UX/UI process based created in collaboration with other UX/UI tutors from Yoobee Colleges as UX/UI design resources and from my experience working in the projects. The below shows the eLearning resources created at Yoobee Colleges for the UX/UI course. The UI layout design is fully design and coded by myself with the new Yoobee branding in mind. You'll also be able to see below some of the key topics taught over ten weeks regarding the UX/UI course for the Level 5 Web & Graphic Design Programme below.
Let me firstly show a bit about some of the initial steps of the UX/UI project. This initial stage is really important to define the project but as well as managing the project itself. Such as Affinity Mapping (sticky note brainstorming), Hypothesis Questioning, Agile Method / Project Management, Kanban Board and defining the project brief. For any further details into any of the process steps, please do not hesitate to reach out to me :)
Next, it is fundamentally one of the important step in any UX/UI project which is the 'users' (hence why it is called 'User Experience' and 'User Interface'. This part contains lots of research into really understanding the user. For some projects, this data could be given but in some cases, we, as product designers need to do the research. Here is some of the things to consider when considering your persona.
Let's not forget to identify our navigation system. This is things like user flow charts, task flows, sitemap etc. Below, are explanations of what is a sitemap and what those symbols mean in a user flow chart. Keep in mind that this is one of the common method of using the shapes but of course, there are other ways also.
Now that we've done the research and planning, it is time to consider the User Interface. While creating the UI, it is important that the MVP (minimal viable product) has been defined. It is important because the app is launched at a relatively fast pace and also essentially saving a lot of time and money.
Here are some of my wireframing and Hi-Fi prototyping from two separate projects. The first example shows wireframing of a website project which considers the semantic tags for front-end web development. The second example shows style tile and the Hi-Fi prototyping for an app design.
Now, there are still more parts to a UX/UI project, and I want to cover more here. If you would like to learn more about it, please do feel free to ask me!
Thank you for viewing :)