Proposal for Replacement of MyNDSU

with BisonConnect
Deborah Pompa, Spencer Fjelstad, Vincent Holmlund, & Gregory Beauclair
11/15/2021
Executive Summary
Problem Statement
North Dakota State University currently uses the website myNDSU as the university’s student
organization and events website. The website myNDSU is difficult to navigate, has features that very few
people know about, allows student organizations and the university very limited ability to customize the
website, and there is no effective way for student organizations to communicate and interact with their
club members. Because of this, very few student organizations and club members use myNDSU.
MyNDSU is also created and maintained by the third-party company Campus Labs. For this reason, it is
difficult for NDSU to fundamentally change aspects of myNDSU to make it more user friendly or add
useful functions to the website.
Proposed Solution
Our solution is for NDSU faculty, graduate students, and undergraduate students to develop and
maintain a new website called BisonConnect. BisonConnect would host customizable webpages for each
of the student organizations. It would also have an events page and useful features such as live chat and
a calendar widget.
Value
As NDSU grows and the students’ needs change, BisonConnect would be able to adapt and grow to best
serve the university. BisonConnect can be developed and implemented with minimal cost to NDSU. This
would save NDSU money because the university would no longer require Campus Labs to maintain the
website myNDSU. It would also provide a unique opportunity for NDSU students to be a part of the
research and development of BisonConnect.
Next steps
BisonConnect would be created during the summer of 2022. Then during fall semester of 2022 student
organizations would begin creating their organization page. BisonConnect would be scheduled to go live
with its organizations and events pages at the beginning of spring semester 2023. At this point NDSU
would no longer need to support myNDSU. The only step that NDSU needs to take to begin the
development process is to create a development team.
Table of Contents
Introduction 1
Background 2
Alternative Solutions 2
Standards 2
Development 3
Design 4
Principles 4
Desktop Version 4
Mobile Version 8
Maintenance 9
Security 9
Development and Implementation schedule 10
Conclusion 10
References 11

List of Visuals
Figure 1.0: Standard Home Page for BisonConnect 4
Figure 1.1: Template 1 for the public facing Organization Page 5
Figure 1.2: Standard Organization Management Page 6
Figure 1.3: Standard Search Results page 6
Figure 1.4: Search Results page in dark mode theme 7
Figure 1.5: Standard User Page 7
Figure 1.6: Standard User Page with pop-out menu activated 7
Figure 1.7: Standard User Page in dark mode theme with pop-out menu activated 8
Figure 2.0: Mobile Home Page for BisonConnect 8
Figure 2.1: Mobile Organization Page 8
Figure 2.2: Mobile Organization Page in dark mode theme 8
Figure 2.3: Mobile Search Results 8
Figure 2.4: Mobile Search Results in dark mode theme 9
Figure 2.5: Mobile User Page 9
Figure 2.6: Mobile User Page with pop-out menu activated 9
Figure 2.7: Mobile User Page in dark mode theme with pop-out menu activated 9
Introduction
The purpose of ENGL 321: Writing in the Technical Professions is to teach Engineering students how to
write technical documents. One of the group projects for the course was to find a problem on the North
Dakota State University campus and using the group’s technical expertise, devise a solution. After
completing preliminary research our group realized that the website North Dakota State University
currently uses for student organizations and events is hard to navigate, has features that very few
people know about, allows student organizations and the university limited ability to customize the
website, and there is no effective way for student organizations to communicate and interact with their
club members.

Our group decided to find a solution that would allow student organizations to better interact and
communicate with their members. Upon researching different website designs, it was decided that the
most appropriate solution was for North Dakota State University to create their own student
organizations and events website. This report is an overview of our research, design idea, and
implementation plan.
Background
NDSU currently uses myNDSU for student organizations and events. The student organizations are only
able to add photos, customize their organization widget, add a description, create events, and link their
social media accounts to their page. It is difficult for organization officers to navigate the management
page to customize any of these things so many organizations do not include them in their page.

MyNDSU also only has one way for student organization officers to communicate with their members.
This is through a relayed email. This is very inefficient because there is no way for a member to respond
to the email. If they try, the response will get lost in the relay. This method works if the officer is just
sending out an announcement, however it does not provide an interactive form of communication.

When we interviewed the Cyber Security Club president Jack Hance, he said that he rarely uses myNDSU
to communicate with club members because it is difficult to update events once they are created, and
files often get lost in emails. Due to this, the Cyber Security Club opts to use a Discord server rather than
myNDSU.

Similarly, when we interviewed the Association for Computing Machinery Club president Sean Hagen, he
also said that he rarely uses myNDSU to communicate with other club members. Instead, he utilizes a
Discord server as the primary form of communication.

These things make myNDSU very inefficient for student organizations to use for communication and
interaction with their organization members as well as the NDSU student body.

Alternative Solutions
Our first plan was to edit my NDSU. The website still possesses a level of functionality that clubs can use.
However, it also contains many flaws as previously mentioned in our memo. We hoped that we could
make a few tweaks to add crucial features to the website. Unfortunately, myNDSU is run by Campus
Labs, a campus involvement solutions company. This means that myNDSU is built using a template
website that Campus Labs uses for many other universities. NDSU is powerless to change the structure
of the website. Theoretically, NDSU could still change the functionality of my NDSU by directing clubs to
use it differently, for example, they could direct clubs to make their own webpage on a different website
and post the link on their myNDSU webpage. However, solutions such as these can only go part of the
way to making myNDSU a fully functioning website.

Our second idea was to switch to another campus solution. One of the main competitors of myNDSU is a
company called Campus Groups. They are used at universities such as Cornell and Georgetown. We
certainly thought that Campus Groups provided a better user interface and more functionality than
myNDSU. Despite the advantages of Campus Groups, NDSU would still be left with the same issue as it
had with Campus Labs: The University cannot tailor the way the website functions to the needs of the
specific campus. Conceivably, if there was a business that allowed the university to customize, NDSU
could switch to that. However, that brings up another issue: Any campus solutions web application
bought from a business will almost certainly incur a larger cost than one that is built by the university
itself. These two issues made a switch in companies a nonviable alternative.

Standards
The building of the application needs to fit the budget that the University designates for the project. The
biggest concern is that at least some of the students developing and maintaining it will need to be paid.
This cost is much smaller than the cost of using a solution produced by a business. However, we will still
need to make sure that the amount of money we spend on that and other things, such as the web
server, will not be too high.

Since the website is being hosted by NDSU and is an official NDSU website, the website must pass
certain security standards set by NDSU Information Technology Services (ITS). For example, one such
standard is that the university must have the ability to gain administrative access to the website if
something were to happen to the website administrators. The website is tested on benchmarks and
must meet a certain level of security before it can be used by the university. This testing will largely be
conducted after the bulk of development concludes.

The website must conform Web Content Accessibility Guidelines 2.0 WCAG 2.0. Compliance with the
American with Disabilities Act requires colleges and universities to provide equal access to websites for
people with disabilities. Among other things, the requirements include alternatives to text content and
accessible color palettes for the colorblind. The website will be run through a handicap compliance
testing application to ensure that it meets all the guidelines.

We will enforce good coding practices. While these are not as important as handicap guidelines, good
coding practices will ensure that future maintainers of the website will be able to understand how it is
structured and therefore be able to make necessary changes to it. The main area where code standards
apply are documentation and naming conventions for things such as methods, variables, and classes. By
following these standards in the short run. A lot of time can be saved on maintenance in the long run.
For the backend, developers will be instructed to maintain standards as outlined in the PHP Standards
recommendation. Standards are also expected to be maintained in all other languages that are used in
building the application.

The university requires that all NDSU webpages, including department websites and myNDSU, display
campus colors and display appropriate content. This certainly applies to the website main page. All
webpages will be primarily in the NDSU green and yellow color scheme unless it conflicts with handicap
requirements. This will also be enforced for the individual organization's webpage. When an
organization submits its webpage to be hosted, it is audited to ensure that it only displays appropriate
content and that it conforms to the proper color schemes. Only then is the webpage hosted on the main
BisonConnect website. Ideally, this process will be automated in the future.

Development
BisonConnect’s development will follow an Agile style development process with aspects of the project
being created in week-long sprints. The goals of these sprints will be established using user stories of
features and functionality of BisonConnect is expected to have written prior to and during development.
Each week the development team will meet with each other in SCRUM style meetings to discuss
progress on their tasks for the previous sprint along with any unforeseen problems or roadblocks
encountered. This is then followed by determining the plan for the next sprint.

Prior to beginning Agile development, members of the development team will be roughly split into two
camps with some overlap: a front-end group and a back-end group. The goal of the former is to create
webpages and interfaces that BisonConnect users will interact with directly, while the latter will be
focused on creating scripts for functionality on the server side of things and managing the database. At
this stage the development team with also create various UML diagrams, webpage mockups, database
schema, and user stories resembling those within this proposal to be used throughout the development.
While none of these may represent exact final functionality, they provide a good basis for project
direction.

Technologies to be utilized for BisonConnect will follow a common development stack of open-source
technologies. For front-end, the JavaScript library React will be utilized to provide a sleek and modern
look to our webpages while still being flexible in appearance and functionality. Back-end will be utilizing
a slight variant of the well-known LAMP stack. Serving will be an Apache 2 server hosted from an
Ubuntu Linux virtual machine. PHP will be used to handle server computations along with interactions
with a PostgreSQL database used to store various information such as events and announcements.
Usernames and passwords for student accounts will not need to be handled or stored in any way as the
site can obtain verification of identity through Microsoft accounts in the same way myNDSU currently
does.

Design
Principles

The main goals of BisonConnect are usability and quality of life improvements. BisonConnect is meant to
be simple and easy to use. The goal is to create something anyone can use regardless of technical or
design knowledge.

Desktop Version

To begin, the Home Page is the first step in creating this reality and making a good first impression. Our
design is meant to be simple here with the home page (Figure 1.0) being very bare bones. A search bar,
“announcements” section, and a “helpful links” section below that. The color scheme is the standard
Bison TM green and gold. The only deviation is the login button which was made blue for it to stand out
more.

Figure 1.0: Standard Home Page for BisonConnect

The login is the standard NDUS System login. We decided to use this solution in order to both make
BisonConnect more unified with other NDSU services, as well as provide security. An NDUS account is
necessary to have an account on BisonConnect, thus ensuring that the userbase stays manageable and
accountable.

In the vein of simplicity there are two default layouts that are provided for club/organization pages.
Figure 1.1 shows one of the two. The organization's name takes the large main space on the top banner,
while BisonConnect is moved to the bottom right. Having the organization name take a prominent place
on the banner makes it easy to see where you are when using BisonConnect. Below the ever-present
search bar are the customizable sections. One is dedicated to the events and announcements for the
individual organization. A calendar widget that shows the current date and upcoming events in a
monthly calendar style will also be prominently featured. A mosaic for pictures that the organization
posts rounds out the three large sections. On the side bar, below the user’s avatar and settings button
will be two sections that are a quality-of-life improvement. Firstly, there is a section with a listing of the
club/organization officers and the advisor. Secondly there is a helpful links section that will be split
between the standard helpful links listed on the home page and custom links that the organization can
specify.

Figure 1.1: Template 1 for the public facing Organization Page

Speaking of customizations, Figure 1.2 shows the Standard Organization Management Page. This
management page allows the organization president or other designated users the ability to make edits
to the public facing organization page. The events, photos, and calendar will all be resizable and
movable by using the customize button in the command cluster to the right of the preview pane. The
photos section and the calendar are optional elements as well. As the user makes edits the changes are
visible in the preview pane of the page.

The customizable links are available for editing by pushing the links button. Otherwise, the other
buttons in the command cluster are just what they say on them. The Roster button brings up the entire
roster of the organization being managed and allows the user to send messages directly to the entire
roster as well as selected subsets of the roster, or just view the member’s profile.
Figure 1.2: Standard Organization Management Page

At the far right of the page are the standard user specific sections that list the organizations the user is
part of, as well as other users that have been designated “friends”. The only difference between a club
leader’s sidebar and an ordinary user’s is the manage button with brings up a menu for the leader to
pick which organization page they would like to manage (if they have authority in multiple
organizations). Next the Search Function will be addressed.

Figures 1.3 and 1.4 show a mockup of a search results page. There are filters to search by user,
organization, date, and proximity to the user's location. The standard user sidebar is also included for
unity and ease of navigation.

Figure 1.3: Standard Search Results page

Figure 1.4 has a different color scheme. This is the dark mode theme that users can select from their
personal settings, as well as just use by default depending on their browser settings. Dark mode was a
feature that came up multiple times in our research as something that would be a quality-of-life
improvement for users.
Figure 1.4: Search Results page in dark mode theme

Figures 1.5 through 1.7 show the standard personal user page in both themes with and without the pop-
out menu activated. The standard user page is essentially an expanded version of the side bar that has
been seen in the previous figures. It has the user’s organizations, friends, and a feed with
announcements/posts from the user’s memberships, as well as events and direct messages from other
users. This page is only visible to the individual user.

The pop-out menu is a stripped-down version of this page that is accessible from anywhere on the site.
It has the user’s friends and their online status, as well as quick links to jump to their organizations or to
make a post.

Figure 1.5: Standard User Page

Figure 1.6: Standard User Page with pop-out menu activated

Figure 1.7: Standard User Page in dark mode theme with pop-out menu activated

Mobile Version

Figures 2.0 through 2.7 show the mobile/app version of BisonConnect. They follow the same pattern as
the desktop version of the site. Some elements are simplified to fit the slimmer profile of a mobile
platform, but all functionality is still present.

Figure 2.0: Mobile Figure 2.1: Mobile Figure 2.2: Mobile Figure 2.3: Mobile
Home Page for Organization Page Organization Page in Search Results
BisonConnect dark mode theme
 Figure 2.4: Mobile Figure 2.5: Mobile User Figure 2.6: Mobile User Figure 2.7: Mobile User
Search Results in dark Page Page with pop-out Page in dark mode
mode theme menu activated theme with pop-out
menu activated
Maintenance
BisonConnect will require some basic maintenance to function at an acceptable and secure level as time
progresses. Some of the most basic maintenance issues will be ensuring all technologies used within
BisonConnect are kept up to date with the most recent stable releases of said technologies. This process
can be fairly easily automated but manual maintenance may be required in some cases.

Larger maintenance issues do of course exist, such as conforming to changing security standards and
reacting to potential bugs reported within the project by users. Creating backups of the project’s
database and other important logs regarding functionality is also critical in the case of a critical
infrastructure failure, wherein it should also be assured that the project is able to shut down cleanly.

Security
Security is a growing concern within the web development community, and this is no different within
the BisonConnect project. This is only increased with BisonConnect being a university-backed project
and needing to conform to NDSU security standards as potential data breaches or cyber-attacks could
be very harmful to students, faculty, and the university as a whole.

One of the larger areas of concern is the potential for student organizations to submit their own custom
websites to better advertise their club. While this is a core idea of the project and is very beneficial to
club leaders, it does potentially leave the door open for malicious content. Club webpages will need to
be thoroughly audited for security issues before they are accepted for use and display.
Another issue that has been expressed is the amount of student information being handled by
BisonConnect and the potential for abuse. While this is a valid concern, the amount of information
obtainable by BisonConnect and club leaders would be no more than is currently available through
myNDSU.

Prior to the launch of the website and on a regular basis after launch, BisonConnect will be subject to
security benchmarks to ensure that the site meets university security requirements and is a safe
environment for students to interact with.

Development and Implementation schedule

We have created a timetable for BisonConnect’s implementation. It was decided that the BisonConnect
website would be created during the summer of 2022. This would allow the BisonConnect development
team to work on the website without having to work around class schedules. By completing the
development in the summer, it would also provide plenty of time for the development team to
complete the website.

Then during the fall semester of 2022 student organizations would begin creating their organization
page. It was decided that the fall semester would be the best time to begin the migration of student
organizations onto BisonConnect because the student organization officers will be on campus at this
time. This will make it easier to introduce them to BisonConnect as well as provide support if they have
any questions about the new website. The new student organization pages will be approved by IT
(Information Technology) and implemented throughout fall 2022 and winter break.

Lastly, at the beginning of the 2023 spring semester, BisonConnect will be opened to the NDSU student
body. This timetable has the development of BisonConnect set to begin and end in the summer of 2022.
Then the implementation will begin in the fall of 2022 and end in January of 2023.

Conclusion
North Dakota State University would benefit from a better student organization and events website.
After much deliberation and consideration of other website designs, we decided that the most effective
solution is for NDSU to create their own website.

This solution would save NDSU money, provide better performance and features, and it would be able
to adapt to NDSU’s future needs. This change would enable students to better connect on campus. It
would also provide a unique learning opportunity for students that participate in the development,
implementation, and maintenance of the new website. We believe that this solution would allow NDSU
to further their goal of being a student focused university.
References
“Ada Accessibility Compliance for College and University Websites: AHA! :: Elliance Blog.” Aha! :: Elliance
Blog | Ideas, Insights and Inspirations., 7 July 2021, https://aha.elliance.com/2017/12/30/ada-
accessibility-compliance-for-college-and-university-websites/.

“Contrast Checker.” WebAIM, https://webaim.org/resources/contrastchecker/.

“Groups.” List of Groups, https://cornell.campusgroups.com/club_signup.

“Groups.” List of Groups, https://georgetown.campusgroups.com/club_signup.

Hagen, Sean, and Spencer Fjelstad. “Interview with Sean Hagen.” 21 Oct. 2021

Hance, Jack, and Spencer Fjelstad. “Interview with Jack Hance.” 21 Oct 2021

“ Involvement@Und.” - Involvement@UND, https://involvement.und.edu/.

Jones, Robert, et al. “Interview with Robert Jones.” 18 Oct. 2021.

Kaminer, Ariel. “Student-Built Apps Teach Colleges a Thing or Two.” The New York Times, The New York
Times, 28 Aug. 2014, https://www.nytimes.com/2014/08/28/nyregion/students-inventing-
programs-to-streamline-their-colleges-data.html.

Latimer, Joseph, and Vincent Holmlund “Interview with Joseph Latimer.” 3 Nov. 2021

“PHP Standards Recommendations - PHP-Fig.” PHPFIG Blog, https://www.php-fig.org/psr/.

University of Michigan Maize Pages, https://maizepages.umich.edu/.