UX-UI
UI (user interface) deals with the anatomy of a webpage, its navigational components. In other words, the UI is concerned with how graphic and textual elements are arranged on a webpage, but not necessarily how they behave. For example, where is the search field located? How many characters does each line of text have? How big is the font size for a header? What color is the menu bar?
UX (user experience) deals with the behavior of the elements within a page. For example, is the search dynamic? How do buttons look when the user mouses over them? How are items tagged? Is the content responsive?
Spaces
Are digital environments that fulfill a given function for an organisation. The design of a space takes its information from the socioeconomic layer of an organisation. For example, some spaces are designed for social interaction or discussions. Others are designed for planning and task management. Others are designed for collaboration on tasks, getting stuff done. Virtual spaces are to be considered as analogous to physical spaces. A building is made of sub-spaces with specific functions, which relate to the reality of human life/activity within them. UI is the totality of digital elements that people use to interact with their digital environment, such as buttons, text fields, etc. These elements are the virtual counterparts of physical things such as light switches, windows, doors, drawers, etc. A light switch is an interface that allows a human to control the light in a room for example. This action can be achieved by twisting two electrical wires together or by flipping a switch, the latter being safer and more user friendly, perhaps even more intuitive. UX refers to how the user experiences within the digital environment. In the case of a physical space we would say that a room is warm, comfortable, charming, relaxing, easy to navigate, etc. In the case of a digital space we would say that it is clear and simple, user friendly, intuitive, responsive, efficient, etc,
See more on Digital environment.
Work by Sensorica
See also
Vocabulary
Glossary of terms
- Flow - The flow of an app or software product is concerned with how you get from one area of the app to another. How is the content accessed?
- User Stories - Simple sentences that state all the desired user actions within a software tool . In other words, use cases eloquently translate the functional requirements into easy to understand language and helps the team decide on what features to include.
- Features - Software features are the attributes of a software tool. They include user-oriented actions as well as back-end functionality. For example, log work, add notifications, edit user profile, search, localisation, etc.
Document types
- Concept map - A concept map is a high level document showing the flow of a software tool. It usually includes things like menu items and a description of the content but does not render these fully. It provides a starting point for thinking about the UI but it does not show the behavior.
- Wireframes - A wireframe shows the full interaction of a software tool, or a section of a software tool. This includes all the behaviors, pop-ups, error messages, etc. A wireframe considers all possibilities of interaction. Wireframe documents should be fully annotated.
- Software release - A release is essentially a version of an app that is deployed.
- Road map - A document showing the software features planned for each release. This allows a team to envision what features will be added to the tool over time and plan accordingly.
Other
- Repository - where the source code of a software project lives. For the NRP/VAS software, that is https://github.com/valnet/valuenetwork.
- Fork - a copy of a software repository that is linked to its source. A fork lives in a different repository. For example, as a UI/UX redesign project gets rolling, it will be good to fork the https://github.com/valnet/valuenetwork repository. This will allow the redesign to be coded and tested while keeping the existing software running.
- Branch - a copy of the software in a repository that remains in the same repository, but that can be worked on independently. The repository contains a master branch, and may contain many other branches for different purposes.
- Pull-request - when some improvements in a branch are ready to be merged into the master branch, or some improvements in a fork are ready to be merged into the source repository, the people who worked on the improvements will issue a pull request to the maintainers of the master branch or source repository. It is a request. It may be rejected. Different projects will have different governance policies and procedures about how to handle pull requests.
- Server - a computer where the “back end” of the NRP/VAS software is executed.
- Client - a device where the user interface for the NRP/VAS software is executed. The Internet is a client-server architecture. The client may be a Web browser or an app on a mobile device or some other options that do not apply much to this situation.
- API - stands for Application Programming Interface. In the case of NRP/VAS, an API would make the functions of the software on the server available to software on clients (browsers, mobile apps, etc.). For example, if the client software wanted information on a project, the API might be something like http://nrp.sensorica.co/project/breathing_games/, and it would return the information about the Breathing Games project in computer-readable form to be displayed by the UI software.