User Interface Design

User Interfaces, or UIs, are what the user utilizes to interact with a piece of software, it often is graphical and displayed in a screen, but it can also be hardware, like a controller. They are the most important part of the software for end users.

For a UI to be useful and likeable by the user or customer, it must be easy to use, must attract the attention, easy and intuitive to use, consistent and responsive. There are two main user interface categories: Command-line interface and graphical interfaces.

Command-line interface (CLI)

It is the most basic interface and consists only of text characters on lines. The first computers used CLIs to interact not particularly for the ease-of-use, but for the minimal resources consumed by it and the simpleness that it has. The main input method for the CLI is the keyboard.
Advanced users often prefer command lines to execute some tasks, as a graphical interface would be too bulky and impractical.
Embedded and remote systems often use CLIs because of the low data rates that they produce and the fact that they can be channeled through a variety of protocols, from serial to over-the-internet SSH connections.

Source
Graphical User Interface

GUIs are what most common users today know to interact with a computer, they are graphical frameworks to interact with a program often in more simple and intuitive ways than CLIs, the disadvantage of graphical interfaces is that they consume more resources, and often require a graphics processor to generate what is on screen. The main input methods for GUIs are mouse and keyboard.

They are often comprised of "windows" that represent a particular instance of a program that is executing, they provide buttons, sliders and tabs that make navigation a breeze, and change and adapt in order to
Continue reading "User Interface Design"

User Interface Design

User Interfaces, or UIs, are what the user utilizes to interact with a piece of software, it often is graphical and displayed in a screen, but it can also be hardware, like a controller. They are the most important part of the software for end users.

For a UI to be useful and likeable by the user or customer, it must be easy to use, must attract the attention, easy and intuitive to use, consistent and responsive. There are two main user interface categories: Command-line interface and graphical interfaces.

Command-line interface (CLI)

It is the most basic interface and consists only of text characters on lines. The first computers used CLIs to interact not particularly for the ease-of-use, but for the minimal resources consumed by it and the simpleness that it has. The main input method for the CLI is the keyboard.
Advanced users often prefer command lines to execute some tasks, as a graphical interface would be too bulky and impractical.
Embedded and remote systems often use CLIs because of the low data rates that they produce and the fact that they can be channeled through a variety of protocols, from serial to over-the-internet SSH connections.

Source
Graphical User Interface

GUIs are what most common users today know to interact with a computer, they are graphical frameworks to interact with a program often in more simple and intuitive ways than CLIs, the disadvantage of graphical interfaces is that they consume more resources, and often require a graphics processor to generate what is on screen. The main input methods for GUIs are mouse and keyboard.

They are often comprised of "windows" that represent a particular instance of a program that is executing, they provide buttons, sliders and tabs that make navigation a breeze, and change and adapt in order to
Continue reading "User Interface Design"

Software Design & Software Architecture

These two parts are essential to software-making, they are sequential steps that ensure a program meets the specifications needed and solves a particular problem, let's start with Architecture.


Source

Software architecture deals with the abstraction part of design, it analyzes the problem and sets a methodolgy to solve it, commonly using blocks. The software architect must be very acquainted with the challenge that he is facing, along with the technologies that can be used to solve it. Nonetheless, the SA doesn't do coding, he gives the product owner a thorough analysis and the underlying structure of the program that must be made, including a design blueprint and the attributes and connections of each part that has to be implemented later.

Software Architecture is, in essence, delivering a structured solution to a problem.

Software Design, on the other hand, deals with the technical details of the implementation of the system. They take into account the environment, adapting the development process to it, incluiding software and hardware constraints. They design and guide the coding process, including testing and debugging, in order for the process to be orderly and ensure success.

Software Design creates the functional part of the archutecture plan.

Software Design & Software Architecture

These two parts are essential to software-making, they are sequential steps that ensure a program meets the specifications needed and solves a particular problem, let's start with Architecture.


Source

Software architecture deals with the abstraction part of design, it analyzes the problem and sets a methodolgy to solve it, commonly using blocks. The software architect must be very acquainted with the challenge that he is facing, along with the technologies that can be used to solve it. Nonetheless, the SA doesn't do coding, he gives the product owner a thorough analysis and the underlying structure of the program that must be made, including a design blueprint and the attributes and connections of each part that has to be implemented later.

Software Architecture is, in essence, delivering a structured solution to a problem.

Software Design, on the other hand, deals with the technical details of the implementation of the system. They take into account the environment, adapting the development process to it, incluiding software and hardware constraints. They design and guide the coding process, including testing and debugging, in order for the process to be orderly and ensure success.

Software Design creates the functional part of the archutecture plan.

User Interface Design

User interface design is the visible part of a software. It focuses on anticipating what users might need to do and ensuring that the interface has elements that are easy to access, understand, and use to facilitate those actions.

Interface Elements

Interface elements are those elements that help the user interact with the software without complications. These can be:

  • Input controls: buttons, text fields, checkboxes, radio buttons, dropdown lists, list boxes, toggles, date fields
  • Navigational components: breadcrumb, slider, search fields, pagination, slider, tags, icons
  • Informational components: tooltips, icons, progress bar, notifications, message boxes, modal windows
  • Containers: accordion

It is important to consider that even though these elements make the navigation easier for the user, the excessive use of them can also make it harder.

Best practices for designing an Interface

  • Keep the interface simple
  • Create consistency and use common UI elements
  • Be purposeful in page layout
  • Strategically use color and texture
  • Use typography to create hierarchy and clarity
  • Make sure that the system communicates what’s happening
  • Think about the defaults

 

Never forget to keep in mind what the user wants. Sometimes your design might seem beautiful to you, but is no adequate for your users. (Something I learned from Interactive Design classes)

Usability. (s.f). User Interface Design Basics. November 23rd, 2016, from Usability Website: https://www.usability.gov/what-and-why/user-interface-design.html


Software Design

This post is about the first step in the Software Development Lifecycle, I’ve already wrote about it so if you don’t know what that is you should read my post it’s really short. Software design is the process in which you listen to the user and transform their needs into something you can code.

Once again I made an infographic because they’re fun, I may write a post about why I love making graphics to explain things. This time is about the software design levels, I got that info from this page.

Software (1).png

I consider this a fundamental part of the project. Although I’m not really a long term planning person and I’m more into improvising, I understand the importance and transcendence of this step in the SDLC and now I see a relationship between all the topics we covered in this course but I think that the only way I’ll truly understand the whole process is to actually make a project and implement all the steps myself.


Design is everything

softwaredesigncomic2
http://www.benhallbenhall.com/2012/07/483/

While I was doing a research abour sofware design, I found a really interesting article by Jack Reeves, who describes a new perspective about this topic.

What do we think about when we hear software design? Well, I think about design patterns and diagrams, which it’s okay. But the article says something different that I like more.

In the software lifecycle we have design, implementation, testing,… And the coding part seems to be in the software implementation, but with extreme programming everything changes, because while you’re implementing you also design, then test, redesign, and so on.

The author of the article says that “real software runs on computers[…] it is not a program listing in C++”. That means the program itself represent a software design. Makes sense? So, practically every sept of a software project is part of the design process.

This idea matches the one discussed in my post about software being an engineering or a craft. The important thing is to know that the real purpose is to help people accomplishing a task.

Source:


Software Verification and Validation

Validation and verification are two different concepts in software engineering, each one can be abbreviated to the questions: are we building the right system? and are we building the system right?

vandv

Validation is concerned with checking that the software actually satisfies the customer’s needs and its objective is to demostrate that the product fulfills its intended use when placed in its intended enviroment, whereas verification is the process which checks if the software is functioning correctly and its objective is to ensure that work products meet their specified requirements.

Source:

The difference between Verification and Validation

Verification vs Validation


User Interface Design

User Interface Design focuses on anticipating what users might need to do and ensuring that the interface has elements that are easy to access, understand and use to facilitate those actions.

The reaction or the experience of the user when ising software doesn’t only depend on the functionality and the aesthetically design, what more influences the user to feel comfortable or not is the user interface.

 

Gestalt Design Principles

Similarity: occurs when objects look similar to one another.

Continuation: occurs when the eye is compelled to move through one object and continue to another object.

Closure: occurs when an object is incomplete or a space is not completely enclosed.

Proximity: occurs when elements are placed close together.

Figure and Ground: The eye differentiates an object from its surrounding area. a form, silhouette or shape is naturally perceived as figure, while the surrounding area is perceived as ground.

15857500937_0d43dc49fc_z

flickr photo by Isaac Kohane https://www.flickr.com/photos/52786697@N00/15857500937 shared under a Creative Commons (BY-SA) license

Best practices for User Interface Design

  • Keep the interface simple
  • Create consistency and use common UI elements
  • Be puposeful in page layout
  • Strategically use color and texture
  • Use typography to create hierarchy and clarity
  • Make sure the system communucates what’s happening
  • Think about the defaults

Sources:

https://www.usability.gov/what-and-why/user-interface-design.html

http://graphicdesign.spokanefalls.edu/tutorials/process/gestaltprinciples/gestaltprinc.htm


Software design patterns

Nature is formed by patterns. As my data structures teacher, Dr. Méndez, keeps saying in our class: “PATTERNS!”. So yeah.

Software desing patterns consist in, as you may think, patterns when designin software (what a great reasoning). But why is this important? When designing with patterns, you have some advantages:

  • Code reutilization: by following the same pattern, one can always have a starting base, instead of starting by scratch.
  • Standarization: using patterns, code becomes simpler to read, easier to understand and, if another developer continues the work, he/she will have a lot less problems with it.
  • Already-working solution: if one pattern works, then it might work with another project.

Software design patterns can be classified into the following:

  • Creational: focused on the creation of objects and the manipulation of them. Examples:
    • Builder
    • Object pool
    • Prototype
  • Structural: focused on relationships between entities. Examples:
    • Adapter
    • Bridge
    • Decorator
  • Behavioral: focused on the behavior of and within objects. Examples:
    • Iterator
    • Publish/subscribe
    • Template
  • Concurrency: focused on multi threading. Examples:
    • Active object
    • Reactor
    • Thread-specific storage
flickr photo by Avital Pinnick https://flickr.com/photos/spindexr/6678273769 shared under a Creative Commons (BY-NC-ND) license
flickr photo by Avital Pinnick https://flickr.com/photos/spindexr/6678273769 shared under a Creative Commons (BY-NC-ND) license