Follow the white rabbit

In this lesson, we will focus on the first part of creating our first practical application, the planning stage. As I was explaining in the previous article, planning is extremely important, because it can save us a lot of trouble later on. Not only it will give us a basic idea about what we need to do and the issues we might encounter, but it will also help keep us focused on single tasks, without jumping from coding to designing, to error solving, to research, or planing, all the time.

The first thing that we need to plan is, obviously, what we want to do. What application do we want to code? For this part, I have thought about building a personal log application, or in other words, a program in which we can keep a personal daily diary. I have chosen this kind of program because:

• it will help us design a CRUD (Create Read Update Delete) application, which is in high demand in many projects.
• it will help us work with text files and text processing.
• it will help us understand the concepts of data structures.
• because we will use classes, we will understand some important OOP (Object Oriented Programming) principles.
• it will help us understand the basic principles of data storing, in multiple ways.
• having a GUI, it will help us understand the principles of creating such an application, the basic way of using XAML to create powerful and highly attractive graphical interfaces.
• being a graphical user interface application, it will help us understand the event driven programming.
• it will also be a program that has a real purpose, something that is actually useful.

Now, let’s think of the main features that our program should have. It should:

• have some sort of authentication system. We don’t want everyone to read our personal diary. We must be able to create new user accounts, log in using a username and password, be able to recover the password in case we forget it, or change it when we want to. We should also offer the option to remember username and password, and also to automatically sign in when the program starts.
• have a main area where we write or read our log entries.
• let us save logs either as text files, or in a database, preferably encrypted.
• have some sort of calendar that will indicate the days which contain log entries, and allow us to display those entries when we click on the highlighted days.
• let us delete one or all log entries.
• let us edit already saved logs.
• let us search for logs containing a certain word or phrase.
• let us navigate through logs by allowing us to view next or previous logs from the one currently displayed.

Next, lets envision how these features should work: when ran, the program should display a window where we would be able to create a new account, log in with an already existing one, recover our password in case we ever forget it, or change it when we want to. After correctly inputting the username and password,  we should have a main window with a menu bar at the top, a side bar containing a calendar which would allow us to visualize which days contain logs, and an area where we can add a new log. We should be able to create a new log directly after login. After saving it, we should be able to see the current day marked as having a log entry. The calendar should let us navigate backwards in time, to see which days have had logs saved, and we should be able to read them. The program should also let us edit the log for the current day by appending the new text to the already existing one, but should not let us edit previous logs, from days that have already passed. We should also be able to delete the log of a selected day on the calendar, or optionally, to let us delete all logs.

We should also be able to specify some options for the program, like specifying where the logs are saved, the font size when viewing logs, a dark, gray or white theme, etc.

Finally, we should be able to search for certain words or phrases in the saved logs.

Now, let’s think about what errors we might encounter. In the authentication phase, someone could try to create an account that already exists. We need to inform them of that. We should also warn the user when the password used is not correct. When creating a new account, we have to make sure the user typed the correct password, by asking for a confirmation, or warn if the password is incorrect. For all the fields, we have to make sure the user doesn’t leave them empty. When writing a log entry in a log that has previously saved, we should check that we can write in that file; the user might open it in Notepad externally, and that would give us errors about trying to modify a file that is already in use. When displaying logs, we should check whether that particular log file still exists, because the user might delete it externally, after we populated the calendar days with log entries. We should ask for confirmation when users want to delete logs.

Let’s outline the principal modules of our application: we need one that deals with authentication, one which deals with writing, editing or displaying logs, one for the populating the calendar days containing logs and one for searching or navigating through logs. We also have a smaller module, for setting global options.

Thinking of the data structures that we could use, we could use a custom User class , containing a few fields, such as the username, the password, the security question and answer, etc. For the logs, we could use a Dictionary, taking the days as the keys and the log entries as values. This will make it easy for us to use a log entry of a particular day.

I was saying that planning the graphical aspect of our application is just as important as its functionality. Let’s sketch how the GUI of our program should look like. The Login screen is really easy:

Then, we have the window to create a new account:

The window to recover the password:

Now, we need to sketch our main window which is displayed after we login, and this is a bit more complex:

The menu structure looks like this:

Finally, the Options window should look approximately like this:

As for the visual style of our application, I already said that we will allow our users to chose from three different themes, a dark, gray and light one. We will use shadows and gradients and anything that we might think a modern application’s interface should use.

Regarding responsivity, we will make the log writing area occupy the most available space. The sidebar should be anchored to the right side of the application, so, when resizing the window, the writing area should be the one resizing too.

In order to learn about more than one possible solution for storing data, we will use three ways of doing that: we will save the data about user accounts in a database, the log files will be saved in text files, while the program’s options will be saved in the Registry.

For the most part, we are done with the planning phase. And, as I said in the previous lesson, spending couple of hours thinking of all these steps will save us a lot more hours, possibly even days, of guessing in the dark or constantly changing stuff that was already made but does not fit with our new ideas anymore.

In the next lesson we will deal with the next phase of building an application: the research step.

Tags: best programming practices, designing, planning, worst programming practices, writing first program

This entry was posted on Saturday, September 1st, 2018 at 18:56 and is filed under First Practical Application. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.