I designed and developed arkis.io as a landing page for the recently-founded software development group Arkis, which consists of myself and several of the other students with whom I took AP Computer Science in the 2016-2017 school year.

The site’s development required mastery of both front-end and back-end development. The back-end is written in Node, and serves both to power the site’s contact form and to serve the twitter profile images of each member of the group. The front-end combines advanced CSS3 and JavaScript to create sophisticated animations.

The site also includes more sophisticated JS-powered animations. At the bottom of the page, immediately after the intro animation plays, is a "mist" animation. This creates a sense of atmosphere and also provides a smooth boundary between the first and second major sections of content on the page while scrolling. The effect is achieved via a basic particle simulation, where each of the particles is rendered as a small "cloud" texture. When the particles move and rotate past each other, a convincing effect of dynamic fog is achieved.

Hover over the animation to reveal markers indicating the position and rotation of each moving particle.

livejson is an open-source Python library I wrote which enables users to easily manipulate JSON files on-disk as though they were in-memory Python dicts. It's a pure-python library with no dependencies, written for compatibility across Python 2 and Python 3. The animation below shows livejson in action; the user is modifying an in-memory object in the Python REPL and the changes made in memory can be seen reflected in the JSON file, displayed behind.

Wikipedia map is a web app for visualizing the connections between Wikipedia articles. The project scrapes Wikipedia and uses the links between pages that are present in each article as an indicator of topics that might be connected.

After simply entering any topic for which a Wikipedia article exists, users can begin to explore connected topics via an interactive navigable graph (rendered on a canvas using vis.js) which displays all of the articles which the user has "discovered." After a while exploring the map, a large graph of hundreds of connected topics is formed.

Wikipedia Map's main goal is to present relationships between topics in a digestible format. Several subtle aspects of the web app help to achieve this goal. First, nodes are lighter in color when they are farther away from the central node.

For example, if the user started with "Penguin" and it took 5 expansions to reach "Ancient Greek", "Ancient Greek" would be a lighter color than a node like "Birding," which only took 2 steps to reach. This indicates that "Birding" is a topic more closely connected with "Penguin" than "Ancient Greek."

maze-cv is a proof-of-concept tool that runs on iOS devices capable of solving mazes plotted on special graph paper, with minimal user input. The tool is built on the fantastic Pythonista platform for Python development on iOS.

I built maze-cv to learn about basic image manipulation and computer vision algorithms, so I implemented all of the logic involved myself, without borrowing from high-level libraries like OpenCV, but instead by reading image values pixel-by-pixel using the Python Imaging Library.

The first step that maze-cv takes is to identify the corners of the maze by finding the red markers. Each pixel in the image is searched and its hue and saturation are inspected in order to determine which pixels are "red." Then, a breadth-first-search algorithm is used to connect adjacent red pixels. The image to the left shows a test in which the center of each identified red object in an image is marked with a small black square.

The third step that maze-cv performs on the image is to threshold the image. Using adaptive thresholding to avoid errors caused by shadows on the page, each pixel in the transformed image is determined to be either light or dark, resulting in an image like the one to the left.

This image can now be easily segmented to determine the value of each square in the 16x16 grid.

The final step, after the image is segmented, is to solve the maze. A graph is constructed, in which all white squares are nodes. Using breadth-first-search on the data from the previous step, adjacent white squares are connected by edges of equal weight in the graph. Then, Dijkstra's algorithm is used to solve (the A* algorithm doesn't bring sufficient performance improvements to mazes of this size to justify its increased complexity of implementation).

For now, the user has to manually mark the starting and ending points on the maze, but this could change in a future version.

Image2ASCII is a Python library I wrote which is capable of approximating images with text, creating ASCII art from any source. To make the tool more accessible, I also wrapped the library in a simple app using Pythonista.

After building the map between each character and its visual weight, image2ASCII assigns characters to different portions of the image. The image is converted to black and white, its contrast increased to improve clarity of the ASCII art, and then the image is downscaled to a size where each pixel could be reasonably represented by a single character. Then, pixel-by-pixel the character with the visual weight most similar to the brightness of the pixel in question is selected and added to the output string. The result is the entire artwork represented as text.

Image2ASCII provides functions for rendering artwork onto an image for display, but the example to the left uses the raw text output and dynamically renders it onto a canvas.

ui2 is a Python module for the iOS app Pythonista which builds on top of Pythonista's ui module to add functionality and convenience. ui2 empowers script authors to take advantage of a much wider range of components, allowing them to create more complex, beautiful, and effective interfaces. The project was commissioned by another community member, who thought that I had the necessary skill to carry out the project and paid me to complete it.

ui2 lets users access UI components like MKMapView that are not available through the original ui module, and also provides pure-python abstractions of ui features to add flexibility and convenience, such as allowing the chaining of multiple animations.

Beyond UIView classes, ui2 provides an extensive set of tools for fully creating complex and polished user interfaces including interactivity, animations, and transitions. ui2 builds upon some Pythonista interfaces to add new features, but also implements its own new pure-Python interfaces and wraps some new Objective-C APIs. Some of the new non-UIView features included in ui2:

• New Transition and ChainedTransition classes that interface with the Objective-C [UIView transitionFromView:toView:duration:options:completion:] method to allow for animated transitions between views like cross dissolves, page flips, and 3D "card flip" effects (see the video to the left).
• A ui2.bind decorator which allows binding Python methods to keybaord shortcuts on bluetooth keyboards connected to the device, functionality which was previously entirely unavailable. Keyboard shortcuts even show up in the "discoverability" menu when the command key is held down on the keyboard.
• New Animation and ChainedAnimation classes allow for playing multiple animations in sequence without manually creating delays for the duration of each animation.
• Redesigned interface for asynchronous UI-related code execution in the form of brand new Delay and DelayManager classes which allow not only for the scheduling of asynchronous actions in the future but for the subsequent cancellation and mutation of these events, which is impossible using Pythonista's built-in ui.Delay interface.
• A new ui2.Path class to replace ui.Path that stores each component of the path in memory so that it can be read back after the path is modified. The old ui.Path class was write-only and it was impossible to retrieve information about the components of the path. ui2.Path intercepts every method call and remembers each piece added to the Path.

For many years, I was one of the most active members of the community surrounding the iOS app Pythonista, a fantastic platform for mobile Python development, and one of the most powerful apps for developers on the iOS platform as a whole. During the time that I spent most heavily using the platform, I made several meaningful and well-used contributions to the software community surrounding the app, many of which took the form of libraries that brought new functionality to the app.

Another significant contribution I made to the community was the initial creation and maintainence of the collaborative Pythonista-Tweaks module, which aims to collect in one place some general enhancements, extensions, and modifications to Pythonista's behavior, and to generally fill in gaps in Pythonista's functionality by querying Objective-C APIs.

Pictured is an example of functionality that Pythonista-Tweaks enables. The script pictured displays progress in real-time as a badge on the app icon, useful for keeping users informed about the progress of long-running tasks even when the app is not open.