I reformatted the page about hiding pages and folders to be more general and have more information. It’s now called “How to Hide Navigation Sidebar Items” and I added this image which is essentially the anatomy of a cascade page.
When researching for conversion programs/emulators for flash last semester, we came up fairly dry. Even though there were a fair amount of projects within the realm of flash preservation, many were unmaintained, slow developing, or dead in the water. And so, we went forward with figuring out an alternative solution, manually converting with only the swf files. It grew to become a fairly daunting task, specifically because the best tool we had to recreate interactivity, Canvasser, does not support multiple pages (which many of the interactives contain). Also, many of the interactives were very extensive with the content within them, and would take a lot of time to reproduce.
Luckily, it seems that a semester later, a new project has arisen, produced by the team at Newgrounds.com, one of the largest maintainers of flash content today (games and animations). They have a strong incentive to keep everything running as if nothing ever happened to the eyes of the end user, and so good, usable progress on their project ruffle.rs is available. I’ve been able to test things, and while it’s not complete (which I assume it will be before flash dies this year), it can emulate the primitive scripting of the Hebrew interactives fairly well in this proof-of-concept phase.
They obviously look identical to the original flash file, and that’s because it essentially is running the flash file, but through WebAssembly, not flash player itself. I have a couple things to look into. First, I need to check compatibility with all interactives. Secondly, scaling is a small issue, where it’s not very clear how the size of the div aligns with the actual size of the flash file, and black bars are produced (a possible workaround is just to make the background black like I’ve done, which masks it). Lastly, there is an image with image caching, in which images load incorrectly most of the time with caching. I’ve tested this by disabling the cache in the developer tools, and the images fix. Luckily, though, it’s already been marked as an issue on the github, and I assume it will be fixed soon. .
Continuing the task to convert some flash interactives into Canvassers, I’ve come to notice that the single paged interactives (about half of all interactives) are somewhat redundant in construction in my view. With this in mind, if I were to be able to convert the information to a static image, then the conversion of these interactives will take much less time.
As you may notice, clicking all of the buttons adds minor value to the information as a whole. So, I converted it to a static image:
This mockup hopefully makes the information a little more clear and simple. My next step is to pitch this to Dr. Raizen to get approval to assign these conversions out.
We now have a final design to go with, which ended up just being a static version of the original flash interactive. However, I have to create a guide that maintains consistency between every image that we will create, and after a lot of trial and error, I have developed a .psd guide and I am drafting steps that an STA can follow to start conversion.
H5P Interactive Videos for COERLL
I’ve begun work on a new project for COERLL, moving to convert old flash interactive videos into a new H5P version. The code for interactivity is there, but subtitles and links need to be implemented. As for subtitles, the files need to be converted into a different extension, and styling will need to be applied to each line. For links, however, there is no file format that H5P’s Interactive Videos uses, so these must be placed manually. Python scripts will be able to fix the subtitles, and speed up the link creation.
I’ve first begun work on the links, which are contained in an .xml file like so:
And I’m parsing the file and reorganizing the contents into a way that is more easily readable and copiable as I place the links.
I still need to reroute them to an actual file, have it automatically parse all files in a directory, and cover all colors for text. After this I’ll work to fix the subtitles, which should be around the same difficulty. Here’s the code for the links so far, not clean and has some useless code in it:
Hebrew Flash Conversion Update
I’ve now got access to a list of extracted flash interactives for the Hebrew site. This removes and human error that would come from manually scraping the page. It turns out there are around 100 flash interactives. However, most of these are multi-paged, and that isn’t something that Canvasser can natively handle (pages must be stacked manually by the user). It’s with this in mind and the complexness/repetitiveness of certain interactives that I’ve decided to take a deep look at all interactives and decide how they should be created.
I’m keeping a few things in mind:
- Which creation tool the interactive’s format most closely matches (The two other creation methods are Quia flashcards and Quia multiple choice)
- If it is to be created in Quia, is there a loss of cohesion, style, or formatting?
- Difficulty to create in Canvasser
- Potential to split an interactive between parts
It ends up being that many modules could be created in Quia (thanks to talks with Kevin), and it stands to be said whether using these tools instead will hinder the original goal of the interactive. This is why Canvasser is the best option disregarding creation, because it can replicate the interactive almost completely. However, they can become fairly difficult to create as each page complicates and the number of pages increases.
Institute for Historical Studies Suffrage Poster
I was tasked with creating a poster for the Institute for Historical Studies, who are hosting a talk to commemorate 100 years since the 19th amendment.
There were a few challenges:
- Lots of text of different types was to be included.
- The tone of the talks were not positive.
- However, I want to portray the talks as critical of the past, but not intensely anti-American.
- A critical tone is hard to portray within a poster, especially given an image of the side the talks support (not the opposition one is being critical about).
My first draft, in an effort to make the different varieties of text easy to distinguish and read, used gradient blocks. However, this ended up actually being confusing to read, and it wasn’t very visually appealing.
The hours I spent with the text, though, rearranging it in different ways, eventually enlightened me to the point where I could see a simple way to organize the text which was still unique. In the end, I was able to insert many elements of design that I enjoy using in my own work: blocky highlighting, faint patterns in the background, and distorted text. The distorted text in particular was actually suffrage posters’ text extracted from photos. The distortion offers a darker, historical tone, which luckily came from the poster creators themselves rather than my own editing (which is a false visual narrative). I really like the end result. Special thanks to Jaclyn for helping touch up elements of the design, such as creating larger negative space to frame the text, and decreasing the size of the colored pattern to remove unwanted attention.