System Development: User-Centric Design

• Developing a system starts with comprehensive research from the user's perspective.
• Understanding user needs, characteristics, context, existing systems, and competitive aspects is crucial for optimizing system-user interaction.
• For interactive software/applications, it is vital to assess functions activated by user interaction.
• Requirements analysis sets the development goal from the target users' viewpoint.
• The design process reinforces the initial requirements analysis to comprehensively satisfy potential system use.
• It prioritizes user experience and usability standards, reflecting supplementary user interface (UI) requirements.
• Scenario and task modeling is the main part of interaction modeling.
• It identifies the application task structure and the sequential relationship between program or system elements.
• A simple task model aids in drawing a detailed scenario of system use.
• Developers/designers can assess system appropriateness and requirement feasibility through this.
• Storyboarding assists scenario/task modeling, enabling designers to create a basic visual interface profile.
• Software interface components, interaction techniques, and hardware specifications are determined in this design process.
• Consolidating interface components into a practical package is important.
• Not all components may be available on a working platform, such as desktop or smartphone.
• Adjustments can stem from platform needs and constraints related to budget, time, personnel, etc.

Hardware Platforms

• Hardware interaction platform design relies on the application's characteristics and operating environment.
• Different interactions/subtasks may need different devices.
• Desktops are suitable for office-related, time-consuming, crucial, and multitasking tasks like documentation and research.
• Smartphones/handhelds facilitate simple, short, and special tasks like calling and messaging.
• Tablet/Pads are for simple, mobile tasks needing a larger screen, such as sales pitches and location mapping.
• Embedded systems handle special tasks where interaction/computations are needed on the spot, typical examples are printers and photocopiers.
• TV/Consoles are for TV-centric tasks needing limited interaction and privacy.
• Kiosks/Installations allow public, limited interaction, short selection tasks, and monitoring tasks.
• Virtual Reality enables spatial training, tele-experience/presence, and immersive entertainment.
• Free Form supports specialized hardware platforms involving customized configurations.

Software Interface Components

• Software interface components form an integral part of a system/application interface and help in simplifying software interaction for users.
• Sometimes, software interface components are referred to as user interface components.
• The section covers essential elements for the graphical user interface (GUI): windows, icons, menus, and mouse/pointer interactions.
• These are often called WIMP (windows, icon, menu, pointer) interfaces.
• WIMP interfaces have significantly advanced computer technologies.

GUI Components

• Areas for focus in interface selection and development include considering WIMP, GUI components and 3D interfaces.
• Windows/Layers provide an application's workspace, interfacing computational processes; multiple subtasks might need simultaneous interfacing via multiple windows/layers.
• Overlapping windows are supported; nonoverlapping windows are used on smaller devices; flipping between apps is possible.
• Icons are are simple, interactive/intuitive objects as compact pictograms, distinctively designed for compact application representation, which facilitates User Interface interaction.
• Earcons (aural icons) serve as icons for the aurally impaired, are distinctive sounds representing events/information.
• Windows Metro UI introduced tiles: dynamic icons displaying useful information related to their purpose.
• Menus enable command/task activation via selection, presented as a 1D list or 2D array.
• Menu item selection involves activating, scanning, and choosing an item.
• Menus are presented through pull-down, pop-up, application bar, 1D toolbar, and tabs.
• Mouse based interactions made it possible for direct metaphorical "touch” to the target objects.

GUI Input Components

• Essential GUI components for soliciting input from a user:
• Text Box: For short to medium alphanumeric inputs.
• Toolbar: Provides quick access to frequently used icons/functions, organized horizontally/vertically.
• Forms: Mixture of menus, buttons, and text boxes for lengthy, interrelated input.
• Dialog Box: Combines menus, buttons, and text boxes for brief and varied input.
• Combo Box: Drop-down list box allowing users to select or type an option.
• 3D interfaces give the perception of depth.
• Interactive 3D images create a virtual reality experience.
• 3D interfaces commonly operate in a 2D space controlled by mouse/touchscreen.
• Inadequate operation might cause exhaustion/inconvenience.
• Current smartphones/tablets include advanced sensors for 3D spatial input, enabling device interaction.

Wireframing

• Wire-framing is the structural design of a website/application service.
• It layouts content/functionality considering user needs/experience.
• Wire-frames establish a base page structure early before adding visual design/content.
• Wire-framing uses basic shapes/elements to block out content and UI element placement, allowing simple rearrangement for prototyping.
• Wireframe tools include Fluid UI, Wireframe CC, Sketch, InVision Studio, and Adobe XD.