Categories: Portfolio
Tags: Hugo, Digital Garden, Instructional Design, Content
Digital gardens are a way of sharing knowledge and inspiration, promoting continuous learning, critical thinking, and curiosity. Moreover, they encourage collaboration and exchange of ideas among individuals, creating a dynamic and enriching learning environment.
The main goal of the website is to serve as a platform for sharing theories, ideas, and knowledge about instructional design, as well as being a repository of useful information for those seeking to learn or enhance their skills in this area. The website should offer a pleasant and interactive user experience, encouraging exploration and the discovery of new concepts and connections.
As instructional design is a constantly evolving field, it is important to stay up-to-date with the latest trends and research. Often, these trends and research are presented at international conferences, academic publications in English, and other materials that are not easily accessible to instructional design professionals in Brazil.
Moreover, the translation of these materials can also enable greater international collaboration and exchange of ideas and practices with other instructional design professionals around the world. This can enrich practice and bring new perspectives and solutions to challenges in the field.
By translating these contents, we are also contributing to the building of a more inclusive and accessible instructional design community, allowing more professionals to have access to the information and knowledge necessary to enhance their practices and drive the advancement of the field in Brazil.
The target audience of the website are educators, instructional designers, students, researchers, and other professionals interested in instructional design. Understanding the needs and expectations of the target audience will help shape the content and structure of the website.
The content scope to be included on the website should involve identifying topics and subareas within instructional design that face difficulties in incorporation into the professional development of Brazilian instructional designers. These gaps exist for a variety of reasons, including language barriers, resource limitations, lack of incentive, limited access to information, and implementation difficulties.
To overcome these barriers, it is important to invest in training programs and encourage constant practice updates, as well as ensure access to necessary information and resources to incorporate new research and trends in instructional design practice, with special focus on the following areas:
The lack of agility in incorporating international research into the professional development of Brazilian instructional designers may have several reasons. Some of them may include:
The overall structure of the website and content will be organized to facilitate navigation and discovery. To do this, we had to think about how to categorize and connect information in an organic and interconnected way, so that users can easily explore the content and follow their own learning path. We decided to use categories, tags, backlinks, and other navigation mechanisms.
We needed to establish a realistic timeline for the development and launch of the website, considering aspects such as research, design, development, deployment, and promotion. We also identified the resources needed for the project, such as tools, collaborators, and budget.
By defining the objective and scope of the project from the beginning, we tried to establish a solid foundation for the development of a successful instructional design-focused digital garden website. This also helped guide future decisions related to the design, content, and functionalities of the website.
When creating a digital garden website focused on instructional design, it is essential to structure the content appropriately to facilitate navigation and discovery, as well as promote organic connection between ideas and information. Here is a detailed description of this process.
Organize the content into categories and subcategories related to instructional design, so that visitors can easily identify and access relevant information. Some potential categories and subcategories include:
For each category and subcategory, there will be an index page that lists the related content. These index pages should serve as entry points for visitors to explore topics in more detail. We consider adding visual resources, such as graphics and images, to make the pages more attractive and informative, always with a focus on ease of learning.
We use tags to connect and interrelate content from different categories and subcategories. For example, an article on the application of constructivist theory in an online learning environment can be tagged with “Constructivism” and “Virtual learning environments”. This facilitates the discovery of related content and helps visitors establish connections between ideas and information.
We incorporate backlinks and references throughout the content, so that visitors can follow links to explore related topics and deepen their knowledge. This promotes organic interconnection between ideas and allows visitors to follow their own learning path through the digital garden.
A digital garden is a space in constant evolution. By adding and updating content, we continue to refine and adjust the structure of the site to accommodate new information and connections. When necessary, we can use a version control system such as Git to track changes and collaborate with other contributors.
We try to include notation and reflection blocks throughout the content to share ideas, thoughts, and experiences related to instructional design. This humanizes the content and helps establish an emotional connection with visitors, as well as demonstrate that the digital garden is a space for continuous learning and growth.
We encourage non-linear navigation through the content, allowing visitors to explore the digital garden according to their interests and needs. We include a visual site map, a knowledge graph visualization that shows connections between topics and helps visitors navigate the content.
While Markdown is a lightweight and easy-to-use markup language, it has limitations in terms of design and functionality, especially when creating a landing page that requires more advanced web design features.
This is a simplified version of a Markdown landing page, with sections and links to the categories and subcategories mentioned earlier, as well as links to the latest articles and an image representing the web of connections between content. To capture the user’s attention, the page includes a clear description of the purpose of the site and an invitation to explore related content.
Creating secondary landing pages or index pages can be useful for delving deeper into each topic and providing easier and organized navigation. However, it is important to remember that this Markdown implementation does not offer all the design and interactivity possibilities found in a complete HTML, CSS, and JavaScript-based solution.
# Digital Instructional Design Garden πΏπ
**Explore** a world of evidence-based information and fresh ideas to enrich your educational practices and strategies.
## π What to expect in our Digital Garden
1. [Learning Theories](learning-theories.md)
2. [Innovative Methodologies](methodologies.md)
3. [Technological Tools](tools.md)
4. [Inspiring Case Studies](case-studies.md)
5. [Emerging Trends](trends.md)
6. [Valuable Resources](resources.md)
## π± Cultivate your knowledge with our latest articles
- [Debunking Learning Myths](debunking-myths.md)
- [Instructional Design and Gamification](gamification.md)
- [Artificial Intelligence in Education](artificial-intelligence.md)
## π Discover the connections in our Garden
[](garden-map.md)
Navigate through our interactive map of the Digital Garden and explore the connections between different topics and contents.
## π Stay up to date
Receive updates on new content, events, and resources first-hand. Subscribe to our newsletter and connect with our Digital Garden.
[Subscribe to Newsletter](newsletter.md)
## π‘ Get in touch
Have a question, suggestion, or want to contribute to our Digital Garden? We'd love to hear from you.
[Contact us](contact.md)
This Markdown landing page version aims to be more creative, including emojis to add a visual and friendly touch to the page. The sections and links were organized slightly differently to improve readability. The description of the purpose of the site and the invitations to explore related content remain, and the interactive map is presented as a way to encourage exploration of the connections between topics.
Next, we needed to define a directory structure for the content of the Jardim Digital de Design Instrucional website. In this structure, each category has its own folder with an _index.md
file that serves as the category’s main page. The Markdown files within each folder represent individual pages for topics related to the category. Additionally, there are folders for the “About,” “Contact,” “Newsletter,” and “Map of the Garden” pages, which also have _index.md
files.
/content
|-- learning-theories
| |-- _index.md
| |-- behaviorism.md
| |-- cognitivism.md
| |-- constructivism.md
| |-- connectivism.md
|-- methodologies
| |-- _index.md
| |-- flipped-learning.md
| |-- project-based-learning.md
| |-- collaborative-learning.md
|-- tools
| |-- _index.md
| |-- LMS-platforms.md
| |-- authoring-tools.md
| |-- educational-apps.md
|-- case-studies
| |-- _index.md
| |-- gamification-in-higher-education.md
| |-- artificial-intelligence-in-education.md
|-- trends
| |-- _index.md
| |-- adaptive-learning.md
| |-- microlearning.md
| |-- mobile-learning.md
|-- resources
| |-- _index.md
| |-- books.md
| |-- articles.md
| |-- courses.md
|-- about
| |-- _index.md
|-- contact
| |-- _index.md
|-- newsletter
| |-- _index.md
|-- map-of-the-garden
| |-- _index.md
Considering the need to keep the content updated and evidence-based, as well as ensuring that the latest information is accessible to professionals, here is the detailed strategy for creating content for the website:
By following this detailed strategy, we believe the website will be a valuable resource for educators, instructional designers, students, researchers, and other professionals interested in instructional design in Brazil. By focusing on evidence-based information and local relevance, the website aims to contribute to the development and dissemination of effective practices in the field of instructional design, benefiting both professionals and students.
These tools and software may vary depending on the specific needs of the project, team, and workflow. It is important to choose the tools that best fit your needs and allow for efficient collaboration and workflow.
Tool | Description |
---|---|
Hugo | For building and managing the site |
Markdown | For writing and formatting the site’s content |
Git | For version control and collaboration |
GitHub or Netlify | For hosting the site |
Visual Studio Code | Source code editor for writing and editing code files |
Google Analytics | For tracking and analyzing site traffic |
SEO tools | Tools like Moz, SEMRush, or Google Search Console for SEO |
Trello or Asana | For project management and task organization |
Canva | For creating graphics and images for the site, such as banners, thumbnails, infographics, etc. |
Slack or Discord | For real-time communication and collaboration with the team |
Google Docs | For collaborating on documents and content planning |
Feedly | For keeping up with relevant blogs and sites and staying up-to-date with the latest trends and research in instructional design. |