Building out my first User Interface Templates
In my previous post, I hinted that challenge one of the Women in Tech (WIT) was about building User templates for an online diary application: MyDiary. To accomplish this task, we were required to create stories on pivotal tracker (PT). PT is simply a project management tool to break down tasks into smaller ones and to track progress while working on those tasks.
I had to learn a lot of new jargon in this phase, from stories to features to chores and then bugs. Features are simply stories that provide verifiable business value to the team’s customer; a chore, on the other hand, is a story that is necessary but provides no direct value to the customer. A bug represents unintended behavior that can be related to features.
Another requirement was creating an account with GitHub (GH) and using that for version control. Among the many other ways of working with it, it was preferred that we use git commands to interact with our repositories [aka “repo’s”]. There’s a whole lot of jargon here too, but I will not delve into that because this post might get a little boring for you.
Git was my biggest blocker because unlike creating stories on PT or writing programs in Visual Studio (VS) code, git is the means of moving those programs from the local repo to the remote repo and vice versa. It might seem like a simple thing to do because I mean its just a matter of typing ‘git this’ or ‘git that’, but you will have the chase for it when you see that “failed to push commits…” message, probably to mean a pull request (PR) or something like that cannot be performed.
VS Code is if not one of the best code editors I have worked with, containing so many extensions that optimize efficiency, make code easy to work with, read and understand.
I used all the above together with using HyperText Markup Language (HTML), Cascading Style Sheets (CSS) and Javascript to write out my pages. HTML describes the structure of Web pages using markup, CSS describes how HTML elements are to be displayed on a screen, paper, or in other media and Javascript is the programming language of HTML and the Web to make interactive pages. These three languages are the core technologies of the World Wide Web.
My pages were hosted on gh-pages (provided by GH). But hey, remember I am just a beginner at this point and these pages were built from scratch, no templates, no external libraries!
Important to note that we were provided with user requirements in terms of what pages were necessary and the tasks to be performed by users. The requirements were captured in PT as stories. The challenge was more centered to design and development, however, it was okay to engineer more requirements.
Before the development phase, user interface design has to be analyzed at different angles, most importantly usability goals and user experience goals.
Usability is the degree to which a software can be used by specified consumers to achieve quantified objectives with effectiveness, efficiency, learnability, memorability, and satisfaction in a quantified context of use whereas user experience refers to a person’s emotions and attitudes about using a particular the system. It includes the practical, experiential, affective, meaningful and valuable aspects of human-computer interaction and product ownership.
The goal of user interface design is to make the user’s interaction as simple and efficient as possible, in terms of accomplishing user goals
Project management, version control & collaboration, front-end development and user interface design are the set of skills I had gotten acquainted with by the end of challenge one. Of course, like any other challenge, it was not easy but a few practices revolving around reading/research, practice and communication worked for me.
