Tech


New Personal Project: Quest Log Alpha

Well, “new” as in I haven’t posted anything about it yet. This is something I am working on in my own time, and surprisingly, it is not a game. Well, mostly at least.

Overview

I like the aesthetic of lists, planners, etc., but in the digital age they are not as prevalent. I stopped carrying planners once I started using a calendar app. However, I still want to keep track of stuff to do. Hence, the hunt for a good task app.

I couldn’t find one. That is, I couldn’t find one that did everything I required of one. Here’s what would happen: I would use an app regularly for a month or two, then its quirks would cause me to procrastinate opening it, and then I would stop using it altogether. So, like many people, I decided I wanted my own todo app. It was time to dust off those app-making skills!

Specifications

So, I want my own app. What is needed for me to keep using an app?

  1. Opens instantly
    Something that quickly puts me off using a productivity app is if it takes more than no time to open. If there are ads or a loading screen, I give up. I need something that I can quickly pull out, enter some data, and tuck away.
    This means that I couldn’t use my beloved familiar tool of Unity to make this.* I landed instead on Android Studio.
  2. Working notifications
    My favorite of the todo apps I tried had been abandoned for years, and unfortunately had a bug with its notifications. As someone who forgets things, that was a no for me.
  3. Minimal overhead
    The great thing about technology is that you can get it to do lots of stuff for you. The more stuff I don’t have to spend time doing, the more likely I am to continue using it.

Great! Now what do I want?

  1. Something fun
    Ah yes, the easiest thing to accomplish. That bit of extra motivation to be productive — I’d be designing some sort of gamification to use on myself. Simple!
  2. Something easy
    Related to the need for minimal overhead, clean and intuitive UI is soothing in an app. This one is actually easier, since I’ll know the UI inside out, and don’t have another user to think about.**

* The free version of Unity has a splash screen that lasts several seconds long on all of its applications.
** Which is a very, very weird feeling for someone who almost exclusively makes for others. I still catch myself thinking “Well, this might be confusing for a user unfamiliar with– Wait a minute!”

Looks

With these needs and wants in mind, I set out to design it. I decided to use XD, since it looked fun. I also tried a bit of Figma, and that was also fun. They are very similar. They are fantastic for setting up basic UI and creating prototypes, and there are many templates with Android UI components (appbars, etc) you can get for free.

With looks, the basic goals are:

  1. Adheres to common app design specs
    Many apps use a similar interface that I am used to. If I don’t have to think about how to perform an action, that will be faster and cause less fatigue.
  2. Easy to parse
    I don’t want an app that’s too visually noisy. One of my earlier iterations had tags showing up in different colors, and while it was pretty, it was difficult to figure out what was going on at a glance.
  3. Simple color palette
  4. Thematic
    I want it to be like an RPG quest log, so ideally it’d look like a scroll or book. I want the UX to reflect this, also. This particular change is more of a goal for the future — in the meantime, I’m just using some of my favorite colors for the palette. (This, however, is why the mockup uses serif fonts).

I’ll avoid going into too much detail on features, since the mock designs don’t fully match what the app will be (story of my life), but I thought I’d share the super basic prototype. I set this up to quickly test out some UX ideas — some of it is good, some I ended up iterating on quite a bit. As I flesh out my app, the vision may change. In the meantime, the prototype is up on my projects page!


Global Game Jam 2019

This image has an empty alt attribute; its file name is Global-Game-Jam-Eugene-2019-sha25605f08af07855b2d9bc9c69e0dca91265aab952e49bc4f74444b9a0984468ff80.png

^ We received these hip badges after the end of the jam

I participated in January’s Global Game Jam! This was my first game jam as an official participant and it was an amazing experience. Besides me (programmer/designer), my team had an artist, an audio person, a designer, and another programmer. I knew half the other members of the team, so it was a nice mix of familiarity and new faces.

I jammed at a site that was organized by the local game development community  here in Oregon (which is where I work now, as a game designer). You can check out the game we made, Third Time’s the Charm, on the GGJ 2019 project site. We intended it to be mobile/web, but with the time crunch the windows build was the only one we got working in time. Such is the nature of the jam!

Several of our team members expressed interest in expanding what we created into the grand design we desired. I would love to continue working on it (even if it’s just to get a mobile build working) in the future.

At the end of the jam, everyone who participated on the site showed off their games. It was super cool to see how each team interpreted the theme (What Home Means to You). I was particularly interested in the projects that used AirConsole. Really got the idea machine churning. Looking forward to sitting down and playing games from other jam sites!


Old Projects, New Skills

Just a small post today, remarking on how it is amazing the lengths one can go in the period of a year or so, just from practice.

I was recently looking through old coding projects from a course, hoping to fix/complete and ones that had not been working. Sure enough, looking at an issue I had in one of them, I realized the problem I was having was the essentially the same as a programming problem I had solved for a coding contest over the summer! And thus, it was an easy fix to get the project in 100% working order. Just goes to show that practicing even little/not overly difficult problems can help keep your skills sharp, and develop new ones. It was good to look through some larger code bases, too, as being able to navigate lots of code is also a skill that can always use more practice.


Interactive Data Analysis and Visualizations

Data Visualization Tools for the Web

One of the major advantages of the digital humanities is the ability to work with and analyze lots of data. Naturally, one wants to visualize that data and analysis results. There are a lot of options out there when it comes tools that aid in data visualization, and some are more intuitive to use than others. While it is wonderful that there are so many tools, it can be difficult to know which ones are best for the job. Their usefulness depends on the type of data being worked with, the overall scope of the project, and how much technical expertise there is on the team.

Chart Making

If you already have the data you want to show and know what kind of visualization you are after, there are several simple chart options available, especially for web display.

Google Charts

Google Charts is a common tool used to make interactive charts on webpages using HTML, CSS, and JavaScript. This may sound a little daunting, but it was designed so that non-coders would still be able to pick it up relatively easily. There is a decent range of available chart types, and all of them are interactive, making them great for integrating into a digital report or webpage. One can either make the data table in the code themselves, or they can link to an online spreadsheet (such as Google Sheets). This is a little limiting in that this is the only way to import data sets, and if one is looking for a more complicated display, it would take a lot more fiddling with code than what might be comfortable. However, it makes great aesthetically pleasing interactive charts for simple needs.

Variance

Variance Charts also plots simple charts via HTML and CSS, but attempts to smoothen out the learning curve even further by dropping the need for JavaScript knowledge altogether. It also is a step up from google charts in that you can import csv files, instead of having to link to a google sheet. However, it does not inherently make the charts interactive. It is a good fit for quick charts with little coding knowledge, and still allows for some stylizing. As they state on their own home page, Variance is not the best choice for more complicated visualizations or data sets greater than ~20k rows.

JS Libraries

If there are project members who are knowledgeable about JavaScript and the HTML DOM/Canvas, then there are many JavaScript libraries that make custom interactive charts easier and more appealing, such as D3js, Plotlyjs, Highcharts, and ChartJS. D3js in particular can be used for complicated data analysis and mining as well. (Many of the higher-level chart makers are built on D3js). These libraries are a good option when there is a programmer on the team, when showing the data is essential, and when the visual needs a certain level of customization that can’t be reached with simpler tools. There are a huge number of these, so the best way to determine which one will be best is to take a quick glance at each and pick the one that works best for the needs or the project.

Data Visualization

For more in-depth analysis or complicated data manipulation, charting tools alone are not going to be the easiest to use. If the project is still in the analysis stage, there are a few good pieces of data analysis software.

Plot.ly

Plot.ly is an online graph maker that lets you import data from multiple sources and requires no coding knowledge to use. It does, however, require an account, and does not have the most intuitive interface. But for those looking for something simpler than Tableau or Orange and do not need their more complex analysis capabilities (or is unable to download them), Plot.ly is a great option, especially as coding knowledge is not really needed. If there is a programmer on the project, then Plot.ly also has a JavaScript library to make more customized visualizations. There is a free and paid version.

Tableau

Tableau is a desktop data visualization software. It lets you either manually define or import data sets from several different filetypes. It allows for many ways to display data, and was specifically created to help with data analysis and visualization. There is a free version (Tableau Public) and a paid version, meaning that the free version students would likely use is a little more limited. It requires no programming experience, but the graphs on Tableau public are all shared to the web publicly, and has limited visual control. However, the interactive visuals can be embedded into other web pages or downloaded as still images.

Orange

At first glance, Orange works much in the same way as Tableau, but is free and open source. It also allows for a lot more involved data mining and analysis. However, its user interface is not as easy to pick up, and to do the more involved data analysis requires more expertise. Its visuals are also not quite as sophisticated, but it is a much more robust tool for an aspiring data scientist. It does not require programming to use, but there is the option to do some scripting if one desires.

Play favorites

These are all decent programs, and in most cases there is not going to be a “best tool” for any given task. Yet one should still keep in mind the skillset and end goals when picking tools. In the end, it comes down to what needs to be accomplished, and what one likes to use and is comfortable with.


DHSI – 3D Modeling and Games for Digital Humanists

These past two weeks, I have been at the DHSI (Digital Humanities Summer Institute) conference. It’s not the easiest experience to describe. There are classes, colloquiums, guest speakers, talks called “unconferences”, presentations, and hangouts. The participants by a vast majority are grad students and above. In each of my classes, I’ve had a nice mix of grad students, phd students,  full on professors, and a few others. I think it’s safe to say it’s a mostly academic-minded conference, though there is definitely value for non-academics with an interest in digital humanities as well. Something that I found absolutely fantastic is that there was a significant lack of barriers or separation by academic group (ie. if I wished, as an undergrad, I could go to dinner with a professor, a phd student, and a masters student with no weird separation or awkwardness in discussion that one tends to experience otherwise). All in all, a fantastic experience – I learned quite a lot, and gained a ton of inspiration for the future.

The first class I took was 3D modeling, which was essentially intro to SketchUp. We made a nice replica of a building in downtown Victoria:

Victoria,_BC_-_The_Guild_(1250_Wharf_Street)_01_(20532374915)

Here’s the front:

gfront

I worked mostly on the back:

gback

I think it all turned out pretty well, for a small group of people who had never used SketchUp before.

The people in this course, by the way, were awesome – Among getting encouraged to become a medievalist, I was able to get a lot of advice and interest about my project, and my impostor syndrome melted away the more I spoke with people.

This second course, Games for Digital Humanists, I decided to take because it’s super relevant to my project, and also, vidja gams are cool. The first day of the course inspired me with many ideas for awesome blog posts, which of course I will obviously  write as soon as I have time and my brain isn’t melting (which, by the way, is why I haven’t been keeping up with the weekly updates).

The first few days were spent working on some fascinating theory (I sense a lot of reading in my future), and then the class split into groups. The instructors of this course invented a game to create games, and so we played this game to come up with a game design. It’s really neat – the last time they taught this course one of the groups took their idea to a kickstarter! (It got fully funded, too). The idea we prototyped was a storytelling game along the same lines as dix-it (fantastic game, by the way, especially with the right people). A group of players draw one protagonist card and one setting card. Then a timer is set and one player draws a “bad” card and has to say a line or two of a story (using the setting and protag) while trying to put a good spin on the bad card. The next player then draws a bad card and does the same thing, trying to build off the previous player’s story bit. The end goal is to make the story end on a happy note.

IMG_20160616_154818

Messy design process (complete with fish)!

We made paper cards and playtested a few rounds – not bad! Something I’d try with the right group of people. I don’t think we’ll be making any kickstarters, though we learned a lot. It was essentially a super short project process, complete with bumps and hurdles. Not a bad ending for just a few days. I also was able to ask some advice about my project from the instructors, and I have a much clearer idea of a timeline and the project’s overall future than I did before.

I feel like I have grown a lot from this trip. Here’s hoping the return trip to the US goes well!