Tag Archives: development

Building Zero Counts

Since launching Zero Counts in 2014, I’ve spent a number of hours overhauling the ‘Chunk’ WordPress theme into a design of my own.

In 2017, inspired by reading Huffington Post Highline’s ‘Millenials Are Screwed’ feature on iPhone X, I decided it was time for Zero Counts to introduce a mobile theme — an OLED-first one at that. (Also, I needed to beat Gruber at his own game.) But I had no idea how or where to start.

My workflow for editing Zero Counts’ theme consisted of searching for the theme’s style.css on my host, copying the file to my desktop, guessing the appropriate CSS changes, copying the file back to my host via FTP, and crossing my fingers.

Meanwhile, my day-to-day work was increasingly spent in Sublime Text, Sourcetree, Github, and leveraging a CI/CD (Jenkins) — most of which had been foreign to me months prior. I was learning the benefits of local testing, change tracking, and automated deployments.

In a fit of panic, I realized how risky it was to be iterating on the Zero Counts theme in production. Whoops!

With my desire to launch a mobile theme, so grew my desire to overhaul my development workflow. At the top of 2018, I got cracking.

Goals

  • Test locally
  • Track changes
  • Break out child theme
  • Create mobile version
  • Deploy automatically to production
  • Bonus: Develop on iOS

Tools

Theme Research

Before doing anything, I needed to get a bit more comfortable with how WordPress themes worked. WIRED’s Jake Spurlock kindly pointed me in the direction of WordPress.org’s theme documentation.

Local Testing

Luckily, the documentation also included details on setting up a local development environment.

More specifically, I needed to set up MAMP (Macintosh, Apache, MySQL, and PHP) on my Mac. This provides, among other things, a local MySQL database for a local WordPress install to read from. WordPress.org has a great article about setting up MAMP here.

Ultimately, I needed to:

  1. Download and install MAMP. (The free version should do the trick.)
  2. Set up MAMP Settings. (My set up show Apache Port: 8888, Nginx Port: 7888, MySQL Port: 8889, Web Server: Apache, Document Root: ~/Sites)
  3. Start MAMP and create a database. (From the phpMyAdmin, I created a database called zerocounts_net.)
  4. Download and install WordPress locally in ~/Sites/[site name].

Because Zero Counts has existing posts, I exported them from my production database on ZeroCounts.net. To import them into the newly created local database, from the WordPress dashboard:

  1. Click Tools
  2. Click Export
  3. Select ‘All content’
  4. Click Download Export File

An XML file with all of my posts was downloaded to my computer and ready to be uploaded to my local PHP database. With MAMP servers started, I entered phpMyAdmin, selected my newly created database, clicked the ‘Import’ tab, chose the XML file that was downloaded from ZeroCounts.net, and specified format: XML. This injected all of my existing posts (plus lot of other stuff) into the local MySQL database.

At this stage, my local site had all of my content, but certainly didn’t look like Zero Counts. I still needed to inject my custom theme. Before that, I wanted to begin tracking changes.

Change Tracking

I won’t go into the technical details of git repositories (repos) as I’m still getting my sea-legs. What I will say is the primary use case is to see a log of code changes and comments associated with the commits for quick investigation, reversions, and collaboration.

Git repositories can exist locally and/or remotely. In the case of Zero Counts, I develop locally using the local WordPress install I configured above, commit (save with a comment to myself) my changes, then push (upload) those code changes and commit details to my remote git repository. I can then go to another device — say my iPad (more on this in a bit) — pull (download) those code changes and commits, and be running/viewing the same code locally on another device. Think of it as a very manually, albeit safe, way of syncing my website’s code between devices.

GitHub is seemingly the standard when it comes to remote git repositories; however, with a free account, one can only create public repositories. I.e. my code would be publicly viewable. Private repositories are available on GitHub to paid accounts starting at $7/mo.

As a hobbyist, paying for a private repo that I may not use frequently seemed silly. Luckily, there is a solution in Atlassian’s Bitbucket. For a novice like myself, seeing little difference between GitHub and Bitbucket, Bitbucket offers free private repositories and therefore a membership from me!

Atlassian also offers a robust Git GUI for macOS and Windows called Sourcetree. There’s some peace of mind using a single developer’s sibling software and service together. As a bonus, I already had some familiarity with Sourcetree from my day-to-day work.

With a Bitbucket account created, I downloaded and installed Sourcetree. I created a new local repository in directory /wp-content/themes/ titled [theme]-child, where [theme] is the name of my default theme. (This will make sense soon.) I checked the “create remote repository” box and signed into my Atlassian account. This created an empty repository on my Bitbucket account for my WordPress child theme.

Child Theme

WordPress themes are great starting places. Chances are, a WordPress user will want to make changes to the theme’s style. With most themes, users can make small appearance tweaks (colors, fonts, etc.) using the simple Appearance editor. Some users many want to go a bit further with how their theme looks and begin digging into the actual CSS.

Some WordPress themes allow for custom CSS that overrides the default theme’s style.css via the Appearance editor. However, there may be bits of the theme that don’t exist within style.css and users will need to poke around in the theme’s many PHP files. This can be a bit overwhelming if you have no familiarity with code. If one is able to successfully make changes to the PHP files, be careful. Changes to themes are typically overridden with regular theme updates. Instead of editing the theme directly, one should create a child theme from the default theme.

In an FTP client, copy the contents of folder /wp-content/themes/[theme] into the new local directory /wp-content/themes/[theme]-child.

Open the new child theme’s style.css file and edit the initial comment as follows:

/*
Theme Name: [Theme] Child
Theme URI: https://domain.com/wp-content/themes/[theme]-child/
Description: [Theme] Child Theme
Author: [Your name]
Author URI: https://domain.com/wp-content/
Template: [theme]
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: [comma separated tags]
Text Domain:  [theme]-child
*/

With a child theme established, the child theme will adopt core PHP updates from the default theme without interrupting your CSS and miscellaneous PHP changes.

Push Child Theme to Bitbucket

Now that I’ve added my child theme to my local repository, it’s time to push it up to Bitbucket.

I use the following terms remind me how to use git:

  • Commit: Save with notes
  • Push: Upload
  • Pull: Download (We’ll come back to this.)

Sourcetree recognizes the addition of the files I copied from my hosting server. In Sourcetree, I clicked the ‘Commit’ button, left a note such as “Initial commit”, checked the ‘Push to remote repository’ box, and committed. This committed (save with notes) and pushed (upload) the files to Bitbucket. The entire batch of files included the note “Initial commit” (or whatever comment I left).

From here on, any changes I make to the files in [theme]-child automatically appear in Sourcetree, ready for commits and pushes.

I try to make it a practice to commit any single change I’m satisfied with. Occasionally, multiple theme changes will be included in a single commit, because I’m human and forget to save and note every little thing I’m doing.

Automatic Deployments to Production

At this point, I was able to make changes and test locally. Once satisfied with my changes, I was able to commit and push these changes to Bitbucket for change tracking and safe keeping.

Now, if you are truly comfortable with your changes, you can set up an automatic deployment to your production server. Note that a safer practice is to set up a staging server to push to first. This ensures your changes are reflected to your liking on the web, saved in the event something detrimental occurs to your local server, and allows you to build on several changes before deploying to production. For Zero Counts, I feel safe with my only testing locally and pushing directly to production. The changes I’m making are usually minimal and the audience size doesn’t necessitate that I be coy about changes as they hit my site. I leverage my small readership for design feedback and make small, visible tweaks often.

Bitbucket includes a feature called Pipelines that will detect when changes have been pushed to my Bitbucket repository, triggering a push of the changed files from Bitbucket to my production server.

For a thorough step-by-step tutorial on setting up Bitbucket Pipelines with WordPress.org, look no further than Peter Brumby’s excellent article, ‘Continuous delivery for WordPress using Bitbucket Pipelines’.

To enable Pipelines, I needed to provided Bitbucket with my SFTP username and password.

  1. Sign into Bitbucket
  2. Select my repo
  3. Choose ‘Settings’
  4. Under PIPELINES, choose ‘Environment variables’
  5. Add SFTP username: Type variable = SFTP_username, Type value = [SFTP username]. Click Add.
  6. Add SFTP password: Type variable = SFTP_password, Type value = [SFTP password]. Check the Secured box. This will obfuscate the SFTP password on Bitbucket.com for additional security. Click Add.

Once I set up my SFTP login credentials as variables, I needed to write instructions for Pipelines to sign into my SFTP and copy the changes I pushed from my local repo to my remote repo ultimately to my SFTP, thus, to ZeroCounts.net.

Pipelines are controlled with a YAML (.yml) file. This essentially provides Pipelines with a set of instructions once a ping from a webhook is detected. (A webhook is like a push notification for servers.)

The YAML file for Zero Counts looks like this:

image: php:7.0.27

pipelines:
  default:
    - step:
        script:
          - apt-get update
          - apt-get -qq install git-ftp
          - git ftp push --user $SFTP_username --passwd $SFTP_password --verbose sftp://ftp.[host]/home/[username]/[domain]/wp-content/themes/chunk-child

The gist of these instructions allows Git to log into my SFTP and copy only the changed files to my production server. The aforementioned article by Peter Brumby explains these steps in more detail.

Mobile Theme

The above is all well and good for desktop theme development, but mobile proved to be a different beast.

I use Jetpack for WordPress analytics and my mobile theme. Jetpack comes with a default mobile theme that can be altered, much like the default WordPress theme. I installed Jetpack on my local install of WordPress from the local WordPress dashboard. The mobile theme lives at ~/Sites/[domain]/wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven.

To set up the remote repo for the mobile theme, I copied the contents of minileven/theme/pub/minileven from my local WordPress install to a folder on my desktop. I then deleted the minileven folder and created a new local (+ remote) repo from Sourcetree named ‘minileven’ in /wp-content/plugins/jetpack/modules/minileven/theme/pub/ and copier the contents of the copied directory back into it. It seems a little redundant, but I wasn’t sure how to initialize the existing minileven directory as a local repo. Once the files were copied back in, I ran an initial commit to the remote repo. Now I was able to track changes to the mobile theme.

Remember the bit above about updates to WordPress themes not affecting the child-theme? Jetpack does not support child themes. After a Jetpack update, a customized mobile theme is overridden by Jetpack’s default theme. (I’m sure I can find what controls WordPress child themes, but that’s another project for another day.) Therefore, after accepting a Jetpack update, the custom mobile theme needs to be pushed back up to Bitbucket to override the default Jetpack theme that sits on the production server.

In this case, there are two types of deployments:
1. Regular mobile theme updates (like my desktop theme updates)
2. Replacing Jetpack’s default theme after a Jetpack update

Remember that YAML file I set up for desktop theme updates? A nearly identical set of instructions can be used to cover item 1. Item 1 is the default pipeline that will run with regular pushes to the remote repo.

For item 2, I needed to create a custom pipeline that I can manually trigger from Bitbucket. I cleverly named this pipeline “full-deploy-after-jetpack-update”. I only run this after a Jetpack update.

image: php:7.0.27

pipelines:
  default:
    - step:
        script:
          - apt-get update
          - apt-get -qq install git-ftp
          - git ftp push --user $SFTP_username --passwd $SFTP_password --verbose sftp://ftp.[host]/home/[username]/[domain]/wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven
  custom: # Pipelines triggered manually
    full-deploy-after-jetpack-update:
      - step:
          script:
          - apt-get update
          - apt-get -qq install git-ftp
          - git ftp init --user $SFTP_username --passwd $SFTP_password --verbose sftp://ftp.[host]/home/[username]/[domain]/wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven

The difference between these pipelines is push vs init. Because the Jetpack update wipes out my custom theme, it also wipes out the git tracking sitting on my production server. The git files need to be replaced and therefore re-initialized. (Initialization is still a little beyond my full comprehension, but I basically understand.)

Now that I was tracking changes of the mobile theme, I could begin work on my OLED-first (black/dark) mobile theme. As of this post, it’s still a work in progress, but I’m pretty satisfied.

iOS Development

With having a mobile theme in place, I began thinking about how neat it would be to develop on a mobile device. This is far from perfect, but it’s gotten me out of binds a few times now.

A little app called Working Copy allows me to latch on to my remote Bitbucket repos, make changes to the files, and push those changes up to Bitbucket, thus triggering a deploy to my production server.

The free version of Working Copy can be upgraded to the Enterprise version. Bonus: The dark icon sticks around.

I wanted to be able to use a full iOS compatible IDE and wanted Coda to be that tool. After paying for Coda for iOS, I found I was mistaken. It doesn’t seem to offer the ability to latch on to remote git repos like the desktop app does. Someday…

Next

This whole endeavor was my January 2018 project. I’ve only recently been able to sit around and write this all out.

There are certainly steps I’ve missed and efficiencies to be found. If you are following along and find glaring issues or gaps, let me know. I’m happy to help and update this post. If you find issues with this process, I’m also all ears. The biggest potential issue being the lack of a staging environment. I’ll put that next on my docket.

Tagged , , , , ,

Xbox One’s 7th Core

A very interesting read from Richard Leadbetter at Eurogamer:

Up until recently, both Xbox One and PlayStation 4 have reserved two entire CPU cores (out of eight available) in order to run the background operating system in parallel with games. Since October, Microsoft has allowed developers access to 50 to 80 per cent of a seventh processing core – which may partly explain why a small amount of multi-platform titles released during Q4 2014 may have possessed performance advantages over their PS4 counterparts in certain scenarios.

However, there’s no such thing as a free lunch, and the additional CPU power comes with conditions and trades attached – however, there is the potential for many games to benefit. Firstly, developers need to give up custom, game-specific voice commands in order to access the seventh core at all, while Kinect’s infra-red and depth functionality is also disabled. Secondly, the amount of CPU time available to developers varies at any given moment – system-related voice commands (“Xbox record that”, “Xbox go to friends”) automatically see CPU usage for the seventh core rise to 50 per cent. At the moment, the operating system does not inform the developer how much CPU time is available, so scheduling tasks will be troublesome. This is quite important – voice commands during gameplay will be few and far between, meaning that 80 per cent of the core should be available most of the time. However, right now, developers won’t know if and when that allocation will drop. It’s a limitation recognised in the documentation, with Microsoft set to address that in a future SDK update.

The concessions Microsoft has been making to the Xbox One (revised DRM model, “dis-Kinect”, price-drop, bundles, and now opening the seventh processing core) are admirable, and considering the recent spike in sales, certainly make for an interesting future for the console war. However, these are just that — concessions. Sony has continued to stay the course with compelling hardware and a simple story. Not to mention this is another hit against Kinect and the original vision of Xbox One.

Tagged , ,

Twitch Adds Game Development Category

Polygon:

The Game Development category was launched on Oct. 16 and works exactly the same way as a category for a specific game on Twitch. But in this case you’re tuning in to watch people develop games live, rather than watch someone playing a released title.

“We conducted a Twitch Town Hall session at PAX Prime which is when we let our community share ideas they would like to see implemented on the platform,” said Marcus “djWHEAT” Graham, Twitch’s director of community and education. “The idea of having a section for game developers was suggested and it resonated with the audience, so that inspired us to add it as a category.”

Twitch has yet to hook me, but this might do the trick.

Tagged , ,

GamesIndustry International: ‘SOE GIRL Scholarship winner announced’

Laura Naviaux, Sony Online Entertainment’s senior VP of global sales and marketing:

SOE has prided itself on being a major catalyst of women’s involvement in our industry. As our company continues to evolve and diversify our portfolio, we’ve found it imperative to refine our approach with game art and development, seeking out varied perspectives from the current and future leading voices in the industry. The market for compelling and original online game experiences is rapidly evolving and as a publisher it is our responsibility to listen and celebrate the spectrum of play styles among our global community, and deliver innovation in art, design and technology.

Congrats to scholarship winner Erin Loelius.

Tagged , , , , , , ,

Journey dev raises $7 million

thatgamecompany:

We are proud to share the news today that our studio has entered the next phase of development on our upcoming project and has raised an additional $7 million in funding. We are happy to partner with Capital Today and a team of other investors who share our vision in making meaningful interactive experiences that inspire, connect, and emotionally touch the hearts of players around the world.

With this new investment, our studio is able to scale up development efforts to focus on making the best game possible in the same spirit as flOw, Flower, and Journey. We’ll also begin laying the infrastructure to self-publish, market, and distribute on our own terms for this next project and beyond.

Cannot wait.

Tagged , , , , , , ,

Dungeon Defenders studio lays off 20%, shift in company culture

Comments from Darrell Rodriguez, CEO of Trendy Entertainment, as they appear on GamesIndustry International:

Currently, we are not profitable, but we have products in the pipeline to get us there. We are in between launches, so our cash flow is a concern. We are taking the necessary steps to fix this to ensure Dungeon Defenders II gets out the door at the great quality people have come to expect. We’re at a critical time where execution and performance is essential to our ongoing success.

We are doing this very unpleasant action with respect, empathy and compassion in consideration of the great work that these people have contributed to Trendy.

As discussed last time, a lot of the culture had already shifted upon my arrival. I’m working closely with devs and leads to create more openness and better communication at all levels of the company. Cultural change does not happen overnight, but we have ongoing efforts to work on better cross-departmental communication, getting the leads directly involved in product planning and holding consistent company wide meetings to ensure we are all on the same page. There’s a long way to go, but we’re on our way

Rodriguez’s statements on culture change are well met. Healthy company culture is key and appears to be a hot topic in light of the layoff crisis plaguing development studios as of late. My thoughts to those affected. Layoff list updated.

Tagged , , , , , , , , , , , ,

Welcoming to new players

Ben Kuchera, Polygon:

In most games of this genre you earn currency which is used to buy items, potions and buffs that make your character more powerful. Picking the right items at the right time for your character is a huge part of both League of Legends and Dota 2.

They were discussing the idea of removing the item shop altogether, and one of the game’s designers was becoming, as Browder put it “emotionally distressed” at the idea of removing an aspect of the game that’s a key part of the genre.

There were people on the team against the idea of an item shop and a gold system, as they just allowed those in the lead to remain in the lead and crush the other side. It added a layer of complexity that may not be welcoming to new players.

Worked well for Hearthstone.

I’ve been dreaming of a cross-over title since the original Warcraft III teaser, initially mistaking the rain of the Burning Legion as Zerg.

Tagged , , , , , , ,

Polygon Human Angle: Queer Games

Mattie Brice, developer of Mainichi:

If I was to watch [Mainichi] be played anywhere it would be upsetting. Maybe upsetting is a good thing. I think we should be upset by games. I think that’s a valid emotion to happen. It’s not meant for me to feel good. It does make other people feel good because in a sense, this game has been validating. Many people are like, “Oh! I’ve had that experience too. I’m not alone.”

Human Angle is such a beautiful series.

Tagged , , , , , , , ,

Save developers and you will save your soul

  • 130 layoffs, Nintendo (Eurogamer, 6/6/14)
  • 37 layoffs, Harmonix (Polygon, 5/29/14)
  • 20% of staff across development and marketing, Trendy Entertainment (GamesIndustry International, 5/21/14)
  • 16 layoffs, Rare (IGN, 5/19/14)
  • [undisclosed] layoffs, PopCap (Polygon, 3/13/14)
  • 700 layoffs, Disney Interactive (Joystiq, 3/6/14)
  • 27 layoffs, Eidos (Joystiq, 3/4/14)
  • [undisclosed] layoffs, Sony Santa Monica (Joystiq, 2/27/14)
  • 70 layoffs, Irrational Games (Joystiq, 2/18/14)
  • 12 layoffs, Eutechnyx (Joystiq, 2/18/14)
  • [undisclosed] layoffs, Ghost Games (Joystiq, 2/1/14)
  • [undisclosed] layoffs, EA Salt Lake (Joystiq, 1/30/14)
  • 3423+ industry layoffs from 1/7/13 – 10/29/13 (GameJobWatch.com)

In a discussion on IGN’s Game Scoop!. the Daemon Hatfield, Greg Miller, Justin Davis, and Brian Altano discussed the Sony Santa Monica layoffs and the ongoing (and seemingly permanent) “ramp up / layoff” structure of AAA studios. During this discussion, the panel made comments around the need for the video game industry to unionize and operate in similar fashion to the film industry:

Daemon Hatfield: “I wonder if the video game industry should be more like the movie industry. You have a crew that works on a movie and when the movie is done, they go on to their next project. They are not full-time employees.”

Greg MIller: “Do you think as far as unionizing?”

DH, Justin Davis, and Brian Altano confirm and agree.

DH: “You have a director that runs a movie, he brings on his crew, they make the game…”

JD: “You assemble a “dream team” for each project. A director has certain DPs and other key positions [and] likes to collaborate with the same people over and over. Presumably all of those people that are one step down also have people they like and they bring their whole crew with them. You get the one guy and then you get his crew.”

GM: “I guess that kind of already happens right?”

BA: “Sort of.”

JD: “It happens a little bit but the issue is that it disrupts people’s insurance and things like that. If there was a union, the equivalent of a SAG card or something, you could just move from project to project. In my opinion (and I haven’t done a tremendous amount of reach on this), but on the surface it seems like something that would be healthy for this business.”

While, many devs may benefit from negotiated salaries, working conditions, hours, and insurance coverage, further research into unions does not seem to offer a terrible amount of protection from layoffs. Nor does it appear that the film industry works this way.

According to Lawyers.com, how a union benefits an employee during a layoff is largely dependent on a collective bargaining agreement (CBA). In short, layoffs of union employees are usually handled on a measure of seniority. The source also goes on to mention the benefits of The Worker Adjustment & Retraining Notification Act (WARN):

Generally, WARN requires employers with 100 or more workers to give you 60 days’ advance notice of some closings and “mass layoffs.” A closing can mean the shut-down of a plant or facility. “Mass layoff” has very specific meanings, but basically it means that a substantial number of workers are being laid off for more than six months. –Lawyers.com

Systems such as WARN would appear to be very valuable for developers in the wake of the seemingly immediate purge of Irrational and Sony Santa Monica employees.

There is a looming fear that if the industry continues at this pace, great artists, programmers, engineers, writers, and the like will be swayed away from from the games industry, potentially diminishing the quality of games released. There is no doubt in my mind that the allure of working on a video game will continue to attract skilled creatives; however, lengthy tenure is sure to wane.

Some will argue that AAA isn’t for everyone and indie development is on the rise. While I agree, many of the skills possessed by indie devs were likely gained from experience at larger studios.

I have never been a developer, part of union, or involved in the film industry. I would appreciate any and all correction of the above information from those with experience.

Should video game developers unionize? Does the film industry actually work in this manner? Does a union offer more protection from layoffs than mentioned above? What is your solution to the state of video game development? Are things fine the way they are?

Tagged , , , , , , , , , , , , ,

Opinion: Why we spend so much money to be so stressed out

Opinion: Why we spend so much money to be so stressed out
Polygon

A great piece on the arc of human development and stress as depicted by three games:

Like most people who use an alarm clock, I have an unhealthy relationship with stress. It hits me in the chest, disrupts my digestion, and wakes me up at all hours of the night — but it’s also the reason I’m going to meet my deadline for this column. Life brings stress, but stress is also a self-inflicted wound, like we’re suffering a blow that may never come.

Not many people would call stress “fun,” and yet video games can be stressful. We sometimes willingly pay money to be more stressed. This year gave us a bumper crop of stressful games, and the other day as I was tossing and turning at 5:00 am., I decided to rank them on the inside wall of my cranium. Lucas Pope’s recent Papers, Please made it onto the list, and so did Richard Hofmeier’s Cart Life. But I started with Nintendo’s Pikmin 3.

– Chris Dahlen, Polygon

Tagged , , , , , , , ,